@media (min-width: 1200px) and (max-width:1399px) {
  .nav-title{
    font-size: 26px;
  }
  #right-1 {
    padding: 20px 20px;
  }
  .time>div, .year>div{
    font-size: 30px;
  }
  .left-nums, .right-nums{
    font-size: 48px;
  }
  .left-1>.left-nums{
    bottom: 50px;
  }
  .right-nums{
    bottom: 30px;
  }
  .number-animate .number-animate-dom{
    width: 36px !important;
  }
}

@media  (max-width:1599px) {
  .s-nums .s-nums-label{
    display: flex;
    flex-wrap: wrap;
    padding: 5px 14px;
  }
  .s-nums .s-nums-label span{
    width: 100%;
  }
}

@media  (max-width:1399px) {
  .my-header{
    padding: 0 40px;
  }
  .nav-title1{
    font-size: 18px;
  }
  .nav-title2{
   width: 200px;
   line-height: 30px;
  }
  .s-left-nums, .s-right-nums{
    font-size: 38px;
  }
  .s .number-animate .number-animate-dom{
    width: 26px !important;
  }
 
}

@media  (max-width:1299px) {
  .my-header{
    padding: 0 30px;
  }
  .nav-title1{
    font-size: 16px;
    margin-left: 20px;
  }
  .year-text span{
    font-size: 28px;
  }
  .content-left>div,
  .content-right>div,
  #cen-2{
    padding: 20px 15px;
  }
  .s-left-nums, .s-right-nums{
    font-size: 32px;
  }
  .s .number-animate .number-animate-dom{
    width: 24px !important;
  }
}

@media  (max-width:1199px) {
  .nav-title1{
    display: none;
   }
  .nav-title{
    font-size: 20px;
    font-weight: bold;
    bottom: 24px;
  }
  #right-1{
    padding: 20px 18px;
  }
  #right-1 .echa-label{
    font-size: 16px;
    margin-bottom:30px;
  }
  .time>div, .year>div{
    font-size: 32px;
  }
  .change-year-icon{
    width: 16px;
    height: 16px;
  }
   .right-nums{
    font-size: 40px;
    bottom: 30px;
  }
  .right-nums .number-animate .number-animate-dom{
    width: 30px !important;
  }
}