 body {
      justify-content: center; /* 水平居中 */
      align-items: center;     /* 垂直居中 */
       background-image: url('https://cdn.kuaidi100.com/images/www/home/home_bg.png');
        background-repeat: no-repeat; /* 不重复背景图 */
 
 
  background-size: 100% 45%; /* 拉伸背景图到宽度100%和高度100% */

  background-position: top center; /* 从顶部开始显示，并保持水平居中 */
 position: relative; /* 设置为相对定位，以便 z-index 生效 */
  z-index: 1000; /* 设置一个较大的 z-index，确保在最上面 */
  
    }





    .icon-container {
      display: flex; /* 让所有元素排成一行 */
      align-items: center; /* 垂直居中 */
      justify-content: center; /* 水平居中 */
    }

    .icon-container img {
      margin-right: 0px; /* 图标与文本之间的间距 */
    }

    .phone, .web, .service,.post {
      font-size: 16px;
      font-weight: bold;
    }

    /* 默认显示完整文本 */
    .phone-text, .web-text, .service-text {
      display: inline;
    }

    /* 媒体查询：在小屏幕设备（手机）上调整显示 */
    @media (max-width: 768px) {
      .phone-text {
        display: none; /* 手机上隐藏完整文本，显示"电话" */
      }
      .web-text {
        display: none; /* 手机上隐藏完整文本，显示"网站" */
      }
      .service-text {
        display: none; /* 手机上隐藏完整文本，显示"网点" */
      }
      
      .post-text {
        display: none; /* 手机上隐藏完整文本，显示"网点" */
      }      

      /* 显示简短的文本 */
      .phone::before {
        content: "电话";
      }
      .web::before {
        content: "WEB";
      }
      .service::before {
        content: "网点";
      }
      .post::before {
        content: "特惠寄";
      }      
    }
    
    
    
    
    
    
    /* 基本样式 */
.post {
  position: relative;
  display: inline-block;
}

.new-badge {
  position: absolute;
  top: -26px; /* 调整位置到文字的上方 */
  right: -20px;
  width: 55px;
  height: 23px;
  background: url(/css/new_heng.png) no-repeat center center;
  background-size: 100% 100%;
}

.my-div {
  height: 60px; /* 设置高度为100px */
  width: 100%; /* 宽度占满父容器的宽度，或者根据需要设置具体宽度 */

}
.icon-container {
  display: flex;
  align-items: center;
}

.icon-container img {
  margin-right: 0px; /* 图标和后面的文字/链接之间有空隙 */
}

.icon-container .phone-text,
.icon-container .web-text {
  margin-right: 10px; /* 文字和下一个元素（如图标或链接）之间有空隙 */
}

.icon-container a {
  margin-right: 10px; /* 每个链接和下一个元素（如图片）之间有空隙 */
}

.icon-container a:last-child {
  margin-right: 0; /* 防止最后一个链接右侧有多余的间距 */
}

.icon-container .post {
  display: flex;
  align-items: center;
}

.new-badge {
  margin-left: 5px; /* 可选，设置标签和文字之间的间距 */
}
.icon-container {
  font-size: 12px; /* 调整文字的大小 */
}

.icon-container img {
  width: 24px; /* 调整图片宽度 */
  height: 24px; /* 保持图片高度一致，如果需要根据比例调整 */
}

.phone-text, .web-text {
  font-size: 12px; /* 调整文本的大小 */
}

.web {
  font-size: 12px; /* 确保链接文本也变小 */
}

.post {
  font-size: 12px; /* 确保特惠寄件链接的文本变小 */
}

.icon-container {
  display: flex;
  align-items: center;
  position: relative;
  top: 10px; /* 将容器整体下移10px */
}

