@charset "utf-8";
/* CSS Document */
*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box}
*,body{padding:0px;	margin:0px;font-family: "微软雅黑";}
body{
  color:#fff;
  font-size: 16px;
  background-color: #033c76;
  background-image: url(../images/bg.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%;
}
html,body{width:100%;height:100%;min-height: 100%; overflow: hidden;}

#screen-container{position: fixed; inset: 0; overflow: hidden;}
#screen{position: absolute; left: 0; top: 0; transform-origin: 0 0;}
li{ list-style-type:none;}
table{}
i{ margin:0px; padding:0px; text-indent:0px;}
img{ border:none; max-width: 100%;}
a{ text-decoration:none; color:#fff;}
a.active,a:focus{ outline:none!important; text-decoration:none;}
ol,ul,p,h1,h2,h3,h4,h5,h6{ padding:0; margin:0}
a:hover{ color:#06c; text-decoration: none!important}
.clearfix:after, .clearfix:before {display: table;content: " "}
 .clearfix:after {clear: both}
.pulll_left{float:left;}
.pulll_right{float:right;}
i{font-style: normal;}
.text-w{color: #ffe400}
.text-d{color: #ff0000}
.text-s{color: #14e144}
.text-b{color: #00deff}

.head{position: relative; height: 90px; background: url(../images/topbg.png) center bottom no-repeat; background-size:100% 100%;}
.head h1{  font-size: 30px;text-align: center; line-height: 90px; color: #daf9ff;}

.head .time{position: absolute; left: 40px; line-height: 40px; top: 0; opacity: .7}
.head .name{position: absolute; right:40px; line-height: 40px; top: 0;opacity: .7}

.mainbox{padding: 0px 20px;}
/* 三列布局：用 flex 保证对齐与间距稳定（替代 float + 负 margin） */
.nav1{
  display: flex;
  gap: 20px;
  margin: 0;
  padding: 0;
  align-items: flex-start;
}
.nav1>li{
  padding: 0;
  float: none;
}

.box{  margin-bottom: 20px; position: relative; z-index: 0;}
.map{position:absolute; z-index: 10; opacity: .8;top: 5%; width:60%; height: 100%; left: 20%; pointer-events: none;}

/* 左侧：肺功能指标监测/ATS质控分析/检测流程整体上移一点 */
#boxSpiroMetrics{
  margin-top: -16px;
}
#boxProcess{
  margin-top: -16px;
}

.map1,.map2,.map3{ position:absolute;  top:0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; pointer-events: none;}
.map1{ z-index: 2; animation: myfirst2 15s infinite linear; display: flex;}
.map2{ z-index: 3; opacity: 0.2; animation: myfirst 10s infinite linear;}
.map3{ z-index: 1;}
.map1 img{ width: 100%}
.map2 img{width: 82%}
.map3 img{width: 80%}

.tit{ display: flex; align-items: flex-end;}
.tit span{ background: url(../images/line1.png) no-repeat bottom right; font-size: 20px; white-space: nowrap; padding-bottom: 10px; padding-right: 20px;}
.tit p{ background: url(../images/line2.png) no-repeat bottom right; width: 100%; height: 13px; margin-bottom: 5px; opacity: .5}
.boxnav{padding: 10px 0 ;}

/* 模块内标题：复用大标题视觉，但尺寸更紧凑 */
.tit.tit-inner{
  margin-top: -2px;
  margin-bottom: 8px;
}
.tit.tit-inner span{
  font-size: 18px;
  padding-bottom: 8px;
}
.tit.tit-inner p{
  height: 11px;
}
  .anchorBL,.BMap_cpyCtrl{display: none;}
#lg-counter{display: none;}



.table1 th{ border-bottom: 1px solid #407abd; font-size: 14px; padding: 10px 0; color: rgba(255,255,255,.8)}
.table1 td{ border-bottom: 1px dotted#407abd;font-size: 14px; padding:10px 0;color: rgba(255,255,255,1)}
.table1 tr:last-child td{border: none;}
.table1 td span{font-size: 12px; transform: scale(.8); display: inline-block;}
.tqdb{height: 100%;}
.tqdb li{height: 50%; float: left; width:33.333%; text-align: center;}
.tqdb li div{height:calc(100% - 25px); }
.tqdb li  h3{ font-size: 13px; color: #fff;}
.jbgc{ height: 100%; position: relative}
.jbgc li{ height: 100%; float: right;}

.jbgc li:nth-child(1){ height: 30%; position: absolute; left: 0;}


.jztxt div{padding: 20px 0 0 0; line-height: 120%;}
.jztxt div i{ font-size: 12px; color: #fff;}
.jztxt div h3{ font-size:20px; color: #00deff;font-family:electronicFont;}
.jztxt div span{ font-size: 13px; opacity: .5}
.jcjg{height: 100%; margin-left: -10px; margin-right: -10px;}
.jcjg li{width: 33.33333%;height: 100%;  float: left; height: 100%; padding: 0 10px;}
.jcjg h3{background: url(../images/tit1.png) center right no-repeat; margin-bottom: 15px;  font-weight: normal; font-size: 15px;}

/* 检测网点：整体上移一点，避免底部溢出 */
#boxSiteNetwork{
  margin-top: -42px;
}
.jcnav{position: relative; background: url(../images/bg1.png) no-repeat left center; height: 160px; width: 100%;}
.jcnav2{ background: url(../images/bg2.png) no-repeat left center; height: 200px; }

.jcnav img{position: absolute; left:14px; top: 50%; margin-top: -24px; }
.jcnav2 img{ left:16px; margin-top: -30px; }
.jcnavp{padding-left:88px;}
.jcnavp>div{
  border: 1px solid #1070aa;
  display: flex;
  font-size: 12px;
  align-items: center;
  padding: 4px 8px;
  margin-bottom: 26px;
  height: 36px;
  overflow: hidden;
}
.jcnav2 .jcnavp>div{margin-bottom: 17px;}
.jcnavp>div ol{ white-space: nowrap; flex: 0 0 auto; }
.jcnavp>div span{ padding-left:8px; color: #00e4ff; white-space: nowrap; flex: 0 0 auto; }
.jcnavp>div i{font-size: 11px; padding-left: 4px; white-space: nowrap; flex: 0 0 auto; }


.ylfw{
  height: 100%;
  margin-left: -5px;
  margin-right: -5px;
  display: flex;
  flex-wrap: wrap;
  row-gap: 14px; /* 略增间隔，六个框整体更紧凑 */
}
.ylfw li{
  width: 50%;
  height: calc(33.33333% - 18px);
  padding: 0 5px; /* 仅保留左右间隔 */
}

/* 检测流程：第二/三排（第3-6个）整体上移一点 */
#boxProcess .ylfw li:nth-child(n+3){
  margin-top: -18px;
}

/* 检测流程：文字更小、框更矮 */
.ylfwbox {
  height: 100%; /* 原来 54% 会导致内容区不足，文字被挤出 */
  border: 1px solid #1070aa;
  padding: 4px 6px; /* 六个框整体略缩小 */
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center; /* 垂直居中，避免底部溢出 */
  gap: 4px; /* 标题与数值之间留出间隔，避免拥挤 */
  overflow: hidden;
}

.ylfwbox p{ 
  font-size: clamp(9px, 0.56vw, 10px);
  line-height: 1.2;
}

.ylfwbox ol{
  /* keep previous layout, but ensure it doesn't get too tall */
  line-height: 1.1;
  display: flex;
  align-items: baseline;
  gap: 6px; /* 数值/单位/涨跌之间间隔更大 */
  white-space: nowrap;
}

.ylfwbox ol span{
  font-size: clamp(14px, 0.95vw, 18px);
  line-height: 1;
}

.ylfwbox ol em{
  font-size: clamp(10px, 0.7vw, 12px);
}

.ylfwbox ol i{
  font-size: clamp(9px, 0.6vw, 10px);
}

.forb{position: absolute; width: 100%; left: 0; bottom: 0;}


.drqk{height: 100%;}
.drqk li{height: 33.33333333%; width: 50%; float: left;
display: flex;align-items: center;
}
@font-face{font-family:electronicFont;src:url(../font/DS-DIGIT.TTF)}
.icon{
  background: url(../images/iconbg.png) no-repeat;
  background-size: 100% 100%;
  width:56px;
  height: 56px;
  min-width: 56px;
  min-height: 56px;
  flex: 0 0 56px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 12px;
}
.icon img{
  display: block;
  max-width: 70%;
  max-height: 70%;
  width: auto;
  height: auto;
  object-fit: contain;
}
.drqk li span{opacity: .5; font-size:14px;}
.drqk li i{ padding-left: 10px;}
.drqk li em{background: linear-gradient( 0deg,#45d3fd, #45d3fd, #61ddb1,#61ddb1); font-style:normal;
    background-size: cover;font-family:electronicFont;
	font-size: 26px;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;}

/* 左侧：表格更紧凑一点，避免“挤”和对不齐 */
#boxSpiroMetrics .table1 th,
#boxSpiroMetrics .table1 td{
	padding: 8px 0;
}



@keyframes myfirst2
{
from {transform: rotate(0deg);}
to {transform: rotate(359deg);}
}

@keyframes myfirst
{
from {transform: rotate(0deg);}
to {transform: rotate(-359deg);}
}

/* === 检测流程：按设备类型做差异化（平板 WebView2 vs 台式机 Chrome） === */

/* 默认（桌面优先）：框稍微矮一些，但文字保持现在的大小 */
.ylfw{
  row-gap: 12px;
}
.ylfw li{
  height: calc(33.33333% - 10px);
}

/* 触摸设备/平板：框和文字都放大一点，避免太小 */
@media (pointer: coarse) {
  .ylfw{ row-gap: 8px; }
  .ylfw li{ height: calc(33.33333% - 7px); }
  .ylfwbox{ padding: 7px 10px; }

  .ylfwbox p{ font-size: clamp(12px, 1.0vw, 14px); }
  .ylfwbox ol span{ font-size: clamp(20px, 2.0vw, 26px); }
  .ylfwbox ol em{ font-size: clamp(12px, 1.15vw, 14px); }
  .ylfwbox ol i{ font-size: clamp(11px, 1.0vw, 12px); }
}

/* 大屏桌面：进一步让框更紧凑一点（避免“框太大”） */
@media (pointer: fine) and (min-width: 1200px) {
  .ylfw{ row-gap: 14px; }
  .ylfw li{ height: calc(33.33333% - 20px); }
}