@media screen and (max-width: 991px) {
  .banner {
    position: relative;
  }
  .banner .notion {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 35px;
    color: #fff;
  }
  .banner .notion h1 {
    margin-bottom: 100px;
  }
  #smart-fire .introduction {
    font-size: 4vw;
    font-weight: bold;
    line-height: 6.4vw;
    text-indent: 2em;
  }
  #smart-fire img {
    max-width: 100%;
  }
  #smart-fire a {
    float: right;
    background-color: #bdbdbd;
    padding: 3.2vw 9.6vw;
    border-radius: 100px;
    font-size: 4vw;
  }
  #elevator-safety {
    background-image: url(/static/images/bg_elevator.webp);
    background-size: cover;
  }
  #elevator-safety .content {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
  }
  #elevator-safety .content img {
    width: 100%;
  }
  #elevator-safety .content h3 {
    font-size: 5.6vw;
    text-align: center;
    color: #5595d2;
    margin: 1.2rem 0;
  }
  #elevator-safety .content p {
    line-height: 5.6vw;
    font-weight: bold;
    font-size: 3.7333vw;
  }
  #elevator-safety .content .platform {
    margin-top: 2rem;
  }
  #elevator-safety .content .platform a {
    float: right;
    background-color: #bdbdbd;
    padding: 3.2vw 9.6vw;
    border-radius: 100px;
    font-size: 4vw;
  }
  #biological-technology {
    background-image: url(/static/images/背景2.webp);
    background-size: cover;
    padding-bottom: 5rem;
  }
  #biological-technology .introduction {
    font-size: 4vw;
    line-height: 6.4vw;
    margin-bottom: 1.5rem;
  }
  #biological-technology .content {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 28.8vw);
    grid-auto-flow: row;
    column-gap: 4.8vw;
    row-gap: 2.4vw;
    justify-content: center;
  }
  #biological-technology li {
    position: relative;
    box-shadow: 0px 3px 7px 0px rgba(107, 107, 107, 0.35);
  }
  #biological-technology li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #biological-technology li span {
    position: absolute;
    left: 6.4vw;
    bottom: 3.2vw;
    font-size: 4.8vw;
    color: #fff;
  }
  #biological-technology li:first-child {
    grid-row-start: 1;
    grid-row-end: 3;
  }
  #biological-technology a {
    float: right;
    background-color: #bdbdbd;
    padding: 3.2vw 9.6vw;
    border-radius: 100px;
    font-size: 4vw;
    margin-top: 1rem;
  }
}
@media screen and (min-width: 992px) {
  .banner {
    position: relative;
  }
  .banner .notion {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 35px;
    color: #fff;
  }
  .banner .notion h1 {
    margin-bottom: 100px;
  }
  .container {
    width: 1040px;
    margin: auto;
  }
  #smart-fire {
    padding: 70px 0 239px;
  }
  #smart-fire h2 {
    font-size: 45px;
    color: #262626;
    text-align: center;
    margin-bottom: 51px;
  }
  #smart-fire .introduction {
    font-size: 18px;
    font-weight: bold;
    line-height: 30px;
    text-indent: 2em;
  }
  #smart-fire img {
    width: 100%;
  }
  #smart-fire a {
    float: right;
    background-color: #bdbdbd;
    padding: 15px 55px;
    border-radius: 100px;
    font-size: 18px;
  }
  #elevator-safety {
    background-image: url(/static/images/bg_elevator.webp);
    background-size: cover;
    padding: 105px 0 155px;
  }
  #elevator-safety h2 {
    font-size: 45px;
    color: #262626;
    text-align: center;
    margin-bottom: 118px;
  }
  #elevator-safety .content {
    display: flex;
    justify-content: center;
    column-gap: 155px;
  }
  #elevator-safety .content > div {
    width: 415px;
  }
  #elevator-safety .content > div img {
    width: 100%;
    height: 320px;
    object-fit: contain;
  }
  #elevator-safety .content h3 {
    font-size: 25px;
    text-align: center;
    color: #5595d2;
    margin: 20px 0 50px;
  }
  #elevator-safety .content p {
    line-height: 28px;
    font-weight: bold;
  }
  #elevator-safety .content .platform a {
    float: right;
    background-color: #bdbdbd;
    padding: 15px 55px;
    border-radius: 100px;
    font-size: 18px;
    margin-top: 68px;
  }
  #biological-technology {
    background-image: url(/static/images/背景2.webp);
    background-size: cover;
    padding: 128px 0 245px;
  }
  #biological-technology h2 {
    font-size: 45px;
    color: #262626;
    text-align: center;
  }
  #biological-technology .introduction {
    width: 960px;
    text-align: center;
    margin: 50px auto 72px;
    font-size: 18px;
    line-height: 30px;
  }
  #biological-technology .content {
    display: grid;
    grid-template-columns: 332px 350px;
    grid-template-rows: repeat(2, 226px);
    grid-auto-flow: row;
    column-gap: 24px;
    row-gap: 12px;
    justify-content: center;
  }
  #biological-technology li {
    position: relative;
    box-shadow: 0px 3px 7px 0px rgba(107, 107, 107, 0.35);
  }
  #biological-technology li span {
    position: absolute;
    left: 28px;
    bottom: 14px;
    font-size: 25px;
    color: #fff;
  }
  #biological-technology li:first-child {
    grid-row-start: 1;
    grid-row-end: 3;
  }
  #biological-technology a {
    float: right;
    background-color: #bdbdbd;
    padding: 15px 55px;
    border-radius: 100px;
    font-size: 18px;
    margin-top: 90px;
  }
}