@font-face {
    font-family: 'DINPro';
    src: url(../fonts/DINPro-Regular.otf);
    font-weight: 400;
}
@font-face {
    font-family: 'SCIN';
    src: url(../fonts/SCIN-Bold.ttf);
    font-weight: 700;
}
/*video::-webkit-media-controls-enclosure{  display: none;}*/

/*video::-webkit-media-controls-play-button { display: none; }

video::-webkit-media-controls-volume-slider { display: none; }

video::-webkit-media-controls-mute-button { display: none; }

video::-webkit-media-controls-time-remaining-display { display: none;}

video::-webkit-media-controls-timeline { display: none; }

video::-webkit-media-controls-current-time-display { display: none; }

video::-webkit-media-controls-fullscreen-button {}*/

body {
    font-family: "Noto Sans SC", "Microsoft YaHei", Helvetica, Arial, sans-serif;
    color: #000;
  }
  a {
      color: #000;
  }
  a:hover, a:focus{
      color: #333;
      text-decoration: none;
  }
  b, strong {
      font-weight: 400;
  }
  .wrap {
      width: 100%;
      max-width: 1780px;
      margin: 0 auto;
  }
  .navbar-default {
      background-color: transparent;
      border: none;
      margin-bottom: 0;
  }
  .navbar-default .navbar-nav>li>a {
      color: #333;
      font-size: 20px;
      font-weight: bold;
  }
  .navbar-default .navbar-nav li.active a, .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
      color: #b51c25;
  }
  .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
      background-color: transparent;
      color: #b51c25;
  }
  .navbar-brand {
      padding: 0 15px;
      width: 192px;
      max-height: 50px;
      background: url(../images/logo.png) no-repeat;
      background-size: cover;
  }
  .navbar-default-one .navbar-brand {
      background: url(../images/logo2.png) no-repeat;
      background-size: cover;
  }
  .navbar-bg {
      background-color: #fff;
  }
  .zz{
      color: #fff;
    line-height: 50px;
    font-weight: 600;
  }
   .navbar-bg .zz{
      color: #333;
  }
  /*ÃƒÆ’Ã‚Â©Ãƒâ€šÃ‚Â¦ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Å“ÃƒÆ’Ã‚Â©Ãƒâ€šÃ‚Â¡Ãƒâ€šÃ‚Âµ*/
  .banner-video {
      background-color: transparent;
      color: #fff;
      width: 100%;
      height: 100vh;
      position: relative;
  }
  .video-nocontrols video::-webkit-media-controls-timeline { 
    display: none;
  }
  .video-box {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 0;
  }
  .video-box video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
  }
  #my-video {
      width: 100%;
      height: 100%;
  }
  .video-box::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.3);
      z-index: 1;
  }
  @keyframes icon {
      0% {
          transform: translate(-50%,0);
      }
      50% {
          transform: translate(-50%,15px);
      }
      10% {
          transform: translate(-50%,0);
      }
  }
  .page-next {
      position: absolute;
      left: 50%;
      bottom: 10%;
      transform: translateX(-50%);
      cursor: pointer;
      animation: icon 1s linear infinite;
  }
  .page-letter {
      width: 100%;
      position: absolute;
      left: 50%;
      top: 50%;
      z-index: 5;
      transform: translate(-50%,-50%);
      font-weight: 900;
  }
  .page-letter .line {
      margin-bottom: 20px;
      position: relative;
      overflow: hidden;
  }
  .page-letter .line .dummy  {
      display: none;
  }
  .page-letter .line .any span {
      color: transparent;
      text-stroke: 1px #fff;
      -webkit-text-stroke: 1px #fff;
      transition: color 0.7s 0.8s ease;
  }
  .history-box {
      width: 100%;
      height: 100vh;
  }
  .history {
      width: 100%;
      height: 100vh;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
  }
  .history-num {
      width: 24%;
      margin-right: 15%;
      height: 320px;
      display: flex;
      justify-content: space-between;
      position: relative;
  }
  .history-num::after {
      content:'';
      display: block;
      width: 44px;
      height: 8px;
      background-color: #111;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%,-50%);
  }
  .history-num-box {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      flex-wrap: wrap;
  }
  .history-num-box span {
      display: block;
  }
  .history-num-letter {
      color: #b51c25;
      font-family: 'SCIN';
      font-size: 20px;
      line-height: 20px;
      letter-spacing: -1px;
      text-align: right;
      margin-right: 30px;
  }
  .history-num-data {
      font-size: 16px;
      line-height: 20px;
      color: #b51c25;
      font-weight: 500;
      letter-spacing: -1px;
      margin-left: 10px;
  }
  .history-num-data b{
      display: block;
      font-family: 'SCIN';
      font-size: 24px;
      line-height: 30px;
  }
  .history-num-year {
      width: 150px;
      font-size: 140px;
      line-height: 110px;
      word-wrap: break-word;
      font-family: 'DINPro';
      color: #1a1a1a;
      position: relative;
      letter-spacing: -15px;
  }
  .history-num-year::before {
      content: '';
      display: block;
      width: 100%;
      height: 10px;
      background: #fff;
      position: absolute;
      left: 0;
      top: calc(50% - 8px);
  }
  .history-num-year::after {
      content: '';
      display: block;
      width: 100%;
      height: 10px;
      background: #fff;
      position: absolute;
      left: 0;
      bottom: -2px;
  }
  
  .history-text{
      width: 60%;
  }
  /*ÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚ÂÃƒâ€šÃ‚Â¦ÃƒÆ’Ã‚Â¤Ãƒâ€šÃ‚Â¸ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬ÃƒÆ’Ã‚Â¤Ãƒâ€šÃ‚Â¸Ãƒâ€šÃ‚ÂªÃƒÆ’Ã‚Â§ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â°Ãƒâ€¹Ã¢â‚¬Â ÃƒÆ’Ã‚Â¦Ãƒâ€¦Ã¢â‚¬Å“Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã‚Â§Ãƒâ€¦Ã‚Â¡ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¾ÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚ÂÃƒÂ¢Ã¢â€šÂ¬Ã‹Å“ÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚Â±ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¢ÃƒÆ’Ã‚Â¥Ãƒâ€¦Ã‚Â½ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â ÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚ÂÃƒâ€šÃ‚Â²*/
  .index-history {
      width: 100%;
      height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
  }
  .index-history-text , .index-history-years{
      display: flex;
      justify-content: space-between;
      width: 100%;
  }
  .index-history-text span {
      font-size: 36px;
      color: #b51c25;
  }
  .index-history-text span b {
      font-size: 42px;
  }
  .index-history-text span:nth-child(1) b {
     margin-right: 20px;
  }
  .index-history-years span {
      font-size: 280px;
      line-height: 260px;
  }
  .index-history-years {
      position: relative;
  }
  .index-history-years::after {
      content: '';
      width: 120px;
      height: 20px;
      background-color: #333;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%,-50%);
  }
  .font-big p{
      display: block;
      font-size: 60px;
      line-height: 60px;
      letter-spacing: 15px;
      font-weight: 100;
  }
  .font-big span {
      display: block;
      font-size: 20px;
      line-height: 28px;
      letter-spacing: 7px;
      font-weight: 100;
  }
  .font-slogn p{
      font-size: 32px;
  }
  .font-slogn span {
      display: block;
      font-size: 18px;
      font-weight: 400;
      letter-spacing: 0.8px;
  }
  .font-line {
      width: 100%;
      height: 1px;
      background-color: #b51c25;
      margin: 70px 0;
      position: relative;
  }
  /*.font-line::after {
      content: '';
      display: block;
      position: absolute;
      left: 0;
      top:-1px;
      width: 50%;
      height: 3px;
      background-color: #000;
  }*/
  .font-line div {
      display: block;
      position: absolute;
      left: 0;
      top: -1px;
      width: 50%;
      height: 3px;
      background-color: #b51c25;
  }
  
  @keyframes font-line-wow {
      0% {
      width: 0%;
  }
  100% {
      width: 100%;
  }
  ;}.font-line-wow {
      -webkit-animation-name:font-line-wow;
      animation-name:font-line-wow;
  }
  .slick-dotted.slick-slider {
      margin-bottom: 0;
  }
  .single-item .slick-dots {
      bottom: 20px;
      text-align: left;
      width: 98%;
      left: 2%;
  }
  .single-item .slick-dots li,
  .single-item .slick-dots li button {
      width: 10px;
      height: 10px;
  }
  .single-item .slick-dots li button:before {
      font-size: 20px;
  }
  .single-item .slick-dots li button:before {
      opacity: 1;
      color: #000;
  }
  .single-item .slick-dots li.slick-active button:before {
      opacity: 1;
      color: #B51C25;
  }
  .swiper-banner .swiper-pagination {
      width: 100%;
      bottom: 20px;
  }
  .swiper-banner .swiper-pagination-bullet {
      display: inline-block;
      width: 50px;
      height: 2px;
      background-color: #fff;
      border-radius: 0;
      opacity: 1;
      margin: 0 5px;
  }
  .swiper-banner .swiper-pagination-bullet-active {
      background-color: #B51C25;
  }
  .honor-box {
      margin: 200px 0 0;
  }
  .honor-history-box {
      border-bottom: 1px solid #B51C25;
      padding-bottom: 120px;
      margin-bottom: 120px;
  }
  .honor-history {
      display: flex;
      justify-content: space-between;
      align-items: center;
  }
  .honor-history {
      text-align: center;
  }
  .honor-history-item span {
      display: block;
      line-height: 1;
      color: #B51C25;
      position: relative;
      font-size: 150px;
      line-height: 120px;
      font-weight: 100;
      letter-spacing: -10px;
  }
  /* .honor-history-item span i {
      letter-spacing: -10px;
  } */
  .honor-history-item:nth-child(1) span::after {
      display: block;
      content: '';
      width: 37px;
      height: 110px;
      position: absolute;
      bottom: 0;
      right: -37px;
      background: url(../images/num_right.png) no-repeat;
  }
  .honor-history-item:nth-child(2) span::after,
  .honor-history-item:nth-child(3) span::after {
      display: block;
      content: '';
      width: 18px;
      height: 20px;
      background: url(../images/num_plus.png) no-repeat;
      position: absolute;
      right: -20px;
      bottom: 0;
  }
  .honor-history p {
      font-size: 20px;
      margin: 30px 0 0;
      font-weight: 300;
      text-align: left;
      padding-left: 20px;
      font-weight: 400;
  }
  .honor-list-box {
      display: flex;
      justify-content: space-between;
  }
  .honor-title {
      width: 100%;
  }
  .honor-title b {
      display: block;
      font-size: 40px;
      margin-bottom: 20px;
  }
  .honor-title span {
      display: block;
      font-size: 20px;
      font-weight: 400;
      letter-spacing: -1px;
  }
  .honor-list {
      display: flex;
      flex-wrap: wrap;
      margin-bottom: 150px;
  }
  .honor-list li {
      width: 50%;
      line-height: 30px;
      font-size: 16px;
      font-weight: 400;
      line-height: 32px;
  }
  .swiper-inner-banner {
      position: relative;
  }
  .swiper-inner-banner-fonts {
      position: absolute;
      left: 50%;
      top: 50%;
      z-index: 10;
      transform: translate(-50%,-50%);
      display: block;
      font-size: 60px;
      font-weight: bold;
      text-transform: uppercase;
      color: #fff;
  }
  
  /*ÃƒÆ’Ã‚Â¥ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¦Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚ÂÃƒâ€šÃ‚Â¸ÃƒÆ’Ã‚Â§Ãƒâ€šÃ‚Â®ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬ÃƒÆ’Ã‚Â¤Ãƒâ€šÃ‚Â»ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¹*/
  .company-box {
      margin: 150px 0 0;
  }
  .company-title span {
      display: block;
      font-size: 40px;
      line-height: 40px;
  }
  .company-title h1 {
      font-size: 50px;
      font-weight: bold;
  }
  .company-title b {
      display: block;
      font-size: 32px;
      font-weight: normal;
      margin-top: 60px;
  }
  .company-text p {
      font-size: 18px;
      line-height: 2;
      margin-bottom: 40px;
      text-align: justify;
  }
  .company-pic {
      margin-top: 150px;
      margin-bottom: 230px;
  }
  .company-honor-img {
      margin-top: 230px;
      margin-bottom: 330px;
  }
  .clients {
      /*border-top: 1px solid #B51C25;*/
  }
  .clients-title {
      margin: 130px 0;
  }
  .clients-title b {
      display: block;
      font-size: 46px;
  }
  .clients-title span {
      display: block;
      color: #808080;
      font-size: 50px;
      font-weight: 100;
      letter-spacing: -2px;
  }
  .clients-box {
      display: flex;
      flex-wrap: wrap;
      /* justify-content: space-between; */
      width: 100%;
      max-width: 92%;
      margin: 0 auto;
  }
  .clients-item {
      cursor: pointer;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 14.285714%;
      margin-bottom: 30px;
  }
  .clients-item img:nth-child(2) {
      display: none;
  }
  .clients-item:hover img:nth-child(1) {
      display: none;
  }
  .clients-item:hover img:nth-child(2) {
      display: block;
  }
  
  /*ÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚ÂºÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¢ÃƒÆ’Ã‚Â©Ãƒâ€ Ã¢â‚¬â„¢Ãƒâ€šÃ‚Â¨*/
  .footer {
      border-top: 1px solid #B51C25;
      padding: 110px 0 40px;
      margin-top: 120px;
  }
  .footer-row {
      display: flex;
      justify-content: space-between;
  }
  .footer-item b {
      display: inline-block;
      font-size: 16px;
      line-height: 30px;
      border-bottom: 1px solid #B51C25;
      font-weight: 700;
  }
  .footer-item ul {
      margin: 20px 0;
  }
  .footer-item ul li {
      line-height: 26px;
  }
  .footer-contact li {
      margin-bottom: 20px;
  }
  .footer-contact span {
      display: block;
      font-weight: bold;
  }
  .index-footer {
      background-color: #231816;
      color: #fff;
  }
  .index-footer a {
      color: #fff;
  }
  .index-footer .footer-item b span {
      display: inline-block;
      color: #B51C25;
      margin-left: 10px;
  }
  
  /*ÃƒÆ’Ã‚Â¦Ãƒâ€¦Ã¢â‚¬Å“Ãƒâ€šÃ‚ÂÃƒÆ’Ã‚Â¥Ãƒâ€¦Ã‚Â Ãƒâ€šÃ‚Â¡*/
  .service-box {
      margin-top: 200px;
  }
  .service-box [id^="p-"] {
      padding-top: 70px;
      margin-top: -70px;
  }
  .service-title h1 {
      font-size: 52px;
      margin: 0 0 20px;
      font-weight: 100;
  }
  .service-title h1 b {
      display: inline-block;
      margin-right: 50px;
      font-weight: 700;
  }
  .service-title span {
      display: block;
      font-size: 30px;
      margin-bottom: 30px;
      font-weight: 300;
  }
  .service-desc {
      display: flex;
      margin-bottom: 50px;
      color: #666;
      margin-top: 30px;
  }
  .service-desc > div:nth-child(1) {
      margin-right: 130px;
  }
  .service-desc b{
      display: block;
      font-size: 26px;
      margin-bottom: 5px;
  }
  .service-desc p{
      font-size: 20px;
      margin-bottom: 0;
      font-weight: 300;
  }
  .service-item {
      /*border-top: 1px solid #000;*/
      padding: 70px 0;
      position: relative;
      display: flex;
      justify-content: space-between;
      transition: all 1s ease;
      overflow: hidden;
  }
  /*.service-item:last-child {
      border-bottom: 1px solid #000;
  }*/
  .service-item-name b{
      display: inline-block;
      font-size: 34px;
      margin-right: 24px;
      font-weight: 500;
      transition: all 1s ease;
  }
  .service-item-name span {
      display: inline-block;
      line-height: 18px;
      color: #999;
      font-weight: 100;
      text-transform: uppercase;
      transition: all 1s ease;
  }
  .service-item-content {
       margin: 20px 0 0;
       font-weight: 300;
       transition: all 1s ease;
  }
  .service-item p {
      margin: 0;
      font-weight: 400;
  }
  .service-item-img {
      opacity: 0;
      height: 0;
      margin-right: -100%;
      transition: all 1s ease;
  }
  .service-item-img img {
    position: absolute;
    right: 0;
    top: 0;
  }
  .service-item::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 1px;
    background-color: #000;
  }
  .service-item::before {
      content: '';
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      z-index: 5;
      width: 0;
      height: 1px;
      background-color: #B51C25;
      transition: all 1s ease;
  }
  .service-item:hover {
    height: auto;
  }
  .service-item:hover::before {
      width: 100%;
  }
  .service-item:hover .service-item-text {
      display: flex;
      flex-direction: column;
      justify-content: center;
  }
  .service-item:hover .service-item-name b{
      font-size: 50px;
      margin-right: 30px;
  }
  .service-item:hover .service-item-name span{
      font-size: 20px;
      line-height: 24px;
  }
  .service-item:hover .service-item-img {
     opacity: 1;
     height: auto;
     margin-right: 0;
  }
  
  /*ÃƒÆ’Ã‚Â¦Ãƒâ€šÃ‚Â¡Ãƒâ€¹Ã¢â‚¬Â ÃƒÆ’Ã‚Â¤Ãƒâ€šÃ‚Â¾ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¹*/
  .case-list-box {
      margin-top: 170px;
  }
  .case-list-item {
      position: relative;
      overflow: hidden;
  }
  .case-list-item a {
      display: block;
      width: 100%;
      height: 100%;
  
  }
  .case-list-item-name {
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      background-color: rgba(0, 0, 0, 0.65);
      transition: all 0.5s ease;
      opacity: 0;
      position: absolute;
      left: 0;
      top: 0;
      overflow: hidden;
      color: #fff;
  }
  /*.case-list-item-name::after {
      content: '';
      display: block;
      width: 130px;
      height: 1px;
      background: #fff;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
  }*/
  .case-list-item-name b {
      font-size: 24px;
  }
  .case-list-item-name span {
      font-size: 14px;
      border-top: 1px solid #fff;
      padding-top: 10px;
      margin-top: 10px;
      text-transform: uppercase;
  }
  .case-list-item-title {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.65);
      transition: all 0.5s ease;
      opacity: 0;
  }
  .case-list-item-title span {
      font-size: 22px;
      color: #ddd;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 100%;
      font-weight: 300;
      /* padding: 25px; */
  }
  /*.case-box .col-md-4:last-child .case-list-item-title span {
      color: #333;
      font-size: 20px;
  }
  .case-box .col-md-4:last-child .case-list-item-title span b {
      font-size: 24px;
      margin-right: 20px;
  }
  .case-box .col-md-4:last-child .case-list-item-title{
      background-color: rgba(255,255,255,0.65);
      opacity: 1;
  }
  */
  .case-list-item:hover .case-list-item-title, .case-list-item:hover .case-list-item-name{
      opacity: 1;
  }
  .case-list-more a {
      display: flex;
      width: 254px;
      height: 58px;
      justify-content: center;
      align-items: center;
      border: 1px solid #000;
      margin: 105px auto 0;
      font-size: 26px;
      transition: all 0.5s;
      font-weight: 300;
      border-radius: 15px;
  }
  .case-list-more a:hover {
      background-color: #B51C25;
      color: #fff;
  }
  .case-more {
      padding-left: 5px;
      padding-right: 5px;
  }
  .case-list-box .row , .case-more .row , .case-box .row{
      margin-left: -5px;
      margin-right: -5px;
  }
  .case-list-box [class*="col-"], .case-more [class*="col-"] , .case-box [class*="col-"] {
      padding-left: 5px;
      padding-right: 5px;
  }
  .case-list-item {
      margin-top: 10px;
  }
  .case-position, .case-content-title {
      margin-top: 170px;
      height: 140px;
      line-height: 140px;
      overflow: hidden;
      font-size: 30px;
      font-weight: bold;
      position: relative;
  }
  .case-position {
    float: left;
    height: 140px;
    padding: 50px 0;
    margin-right: 20px;
  }
  .case-back-ico {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    margin-top: 50px;
    background-color: #fff;
  }
  .case-back-ico , .case-back-ico img{
    border-radius: 50%;
    height: 40px;
  }
  .case-position span {
      margin: 0 10px;
  }
  .case-position span {
      display: inline-block;
      margin: 0 40px;
      font-weight: normal;
  }
  .case-content-title h1 {
      font-size:30px;
      font-weight: bold;
      margin: 0;
      line-height: 140px;
      position: absolute;
      left: 70px;
      top: 0;
  }
  .case-content img, .news-content img {
      max-width: 100%;
  }
  .case-more-title {
      margin-top: 140px;
      line-height: 30px;
      font-size: 24px;
      margin-bottom: 25px;
  }
  .case-more-title b {
      margin-right: 25px;
  }
  /*ÃƒÆ’Ã‚Â¦ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Å“Ãƒâ€šÃ‚Â°ÃƒÆ’Ã‚Â©ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬ÂÃƒâ€šÃ‚Â»*/
  .news-title {
      margin-top: 150px;
  }
  .news-list-item {
      border-top: 1px solid #000;
      padding: 50px 0;
      display: flex;
      align-items: center;
  }
  /*.news-list-item:last-child {
      border-bottom: 1px solid #000;
  }*/
  .news-list-item-img {
      width: 33%;
  }
  .news-list-item-text {
      width: 60%;
      padding: 0 100px;
  }
  .news-list-item-date {
      width: 7%;
      text-align: center;
  }
  .news-list-item-text b {
      display: block;
      font-size: 28px;
      margin-bottom: 10px;
      font-weight: 500;
  }
  .news-list-item-text p {
      font-size: 18px;
      line-height: 30px;
      margin-top: 10px;
      margin-bottom: 0;
      font-weight: 400;
      text-align: justify;
  }
  .news-list-item-date span {
      display: block;
      font-size: 28px;
      font-weight: 400;
  }
  .news-list-item-date i {
      display: block;
      font-size: 106px;
      line-height: 90px;
      font-style: normal;
      font-weight: 100;
      margin-top: 10px;
  }
  .pages {
      margin-top: 40px;
      display: flex;
      justify-content: flex-end;
  }
  .pages a {
      display: inline-block;
      width: 34px;
      height: 34px;
      border: 1px solid #000;
      margin-left: 10px;
      border-radius: 50%;
      font-size: 18px;
      display: flex;
      justify-content: center;
      align-items: center;

  }
  .pages .page-num-current, .pages a:hover {
    background: #000;
    color: #fff;
  }
  .news-content-title {
      margin-top: 200px;
      padding-bottom: 40px;
      border-bottom: 1px solid #000;
      margin-bottom: 60px;
      display: flex;
      justify-content: space-between;
  }
  .news-content-title h1 {
      font-size: 46px;
      line-height: 46px;
      margin: 0;
  }
  .news-content-title span {
      display: block;
      font-size: 30px;
      line-height: 46px;
  }
  .news-content , .case-content{
      font-size: 16px;
      line-height: 1.6;
  }
  .news-content-back {
    /*margin-top:70px;*/
    /*border-top: 1px solid #000;*/
    padding-top: 30px;
    font-size: 24px;
    line-height: 24px;
  }
  .news-content-back a {
    display: inline-block;
    background: url(../images/back.png) no-repeat left center;
    padding-left: 45px;
  }
  .news-content-back a:hover {
    color: #000;
  }
  .news-content-back a span {
    margin-right: 15px;
  }
  
  /*ÃƒÆ’Ã‚Â¨Ãƒâ€šÃ‚ÂÃƒÂ¢Ã¢â€šÂ¬Ã‚ÂÃƒÆ’Ã‚Â§Ãƒâ€šÃ‚Â³Ãƒâ€šÃ‚Â»*/
  .contact-box {
      margin-top: 200px;
      display: flex;
      justify-content: space-between;
  }
  .contact-text {
      position: relative;
  }
  .contact-text-content {
      font-size: 18px;
      line-height: 30px;
  }
  .contact-text-content b {
      display: block;
      font-size: 20px;
      font-weight: 700;
      margin-bottom: 20px;
  }
  .contact-text-content p {
      margin: 20px 0 0;
      font-size: 16px;
      line-height: 25px;
      font-weight: 400;
  }
  .contact-ewm {
      /* position: absolute; */
      left: 0;
      bottom: 0;
      padding-top: 10px;
  }
  .contact-map {
      width: 60%;
      height: 560px;
  }
  
  /*ÃƒÆ’Ã‚Â©Ãƒâ€šÃ‚Â¡Ãƒâ€šÃ‚Â¹ÃƒÆ’Ã‚Â§ÃƒÂ¢Ã¢â€šÂ¬Ã‚ÂºÃƒâ€šÃ‚Â®ÃƒÆ’Ã‚Â§Ãƒâ€šÃ‚Â ÃƒÂ¢Ã¢â€šÂ¬Ã‚ÂÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚ÂÃƒÂ¢Ã¢â€šÂ¬Ã‹Å“*/
  .projcet-box {
      margin-top: 200px;
      display:flex;
      justify-content: space-between;
      
  }
  .project-list-box {
      width: 100%;
  }
  /*.active-list {
      display: block;
  }*/
  .projcet-list {
      flex: 1;
  }
  .projcet-item {
      display: flex;
  }
  .project-item-text {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
  }
  .project-item-text-title span {
      display: block;
      font-size: 30px;
      line-height: 30px;
      margin-bottom: 30px;
      font-weight: 100;
  }
  .project-item-text-title b {
      display: block;
      font-size: 20px;
      line-height: 28px;
      font-weight: 300;
  }
  .project-item-text-series {
      font-size: 34px;
      line-height: 30px;
      color: #b4b4b4;
      font-weight: 300;
  }
  .project-item-text-series span {
      color: #B51C25;
      margin-right: 26px;
  }
  .project-item-text-series i {
      font-style: normal;
  }
  .project-item-text-desc p {
      font-size: 14px;
      line-height: 2;
      color: #666;
      margin-bottom: 0;
      font-weight: 300;
  }
  .project-item-img {
      flex: 1;
      width: 0;
      padding: 0 15%;
  }
  .project-item-img img {
      max-height: 640px;
  }
  .swiper-project .swiper-pagination-fraction {
    bottom: 0;
  }
  .swiper-project-ico {
    margin-top: 20px;
  }
  .swiper-project-ico .swiper-slide {
    width: 100%;
    height: 100px;
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 5px;
  }
  .swiper-project-ico img{
    cursor: pointer;
    height: 100%;
    border-radius: 8px;
  }
  .swiper-project-ico .swiper-slide-thumb-active{
    border-color: #B51C25;
  }
  
  .project-nav li span {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 36px;
      height: 36px;
      line-height: 36px;
      border: 1px solid #000;
      border-radius: 50%;
      margin-bottom: 10px;
      font-size: 20px;
      cursor: pointer;
  }
  .project-nav li.active span{
      background-color: #B51C25;
      color: #fff;
      border-color: #B51C25;
  }
  .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after,
  .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
      color: #666;
      
  }
  
  
  @media (min-width: 1600px) {
      .container {
          width: 1630px;
      }
  }
  
  @media (min-width: 992px) {
      .col-md-1-7 {
          width: 14.28571428%;
      }
  }
  
  
  @media (min-width: 768px) {
      .navbar-default {
          padding: 10px 0;
      }
      .navbar-default .navbar-nav>li>a {
          padding: 15px 0;
          margin: 0 45px;
      }
      .page-letter .line {
          font-size: 70px;
          line-height: 64px;
          margin-bottom: 15px;
      }
      .navbar-default-one .navbar-nav>li>a{
          color: #fff;
      }
      .project-nav li:nth-last-child(1), .project-nav li:nth-last-child(2) {
          margin-top: 100px;
      }
      .video-box-play {
        display: none;
      }
      .fixed-ico {
        position: fixed;
        top: 90px;
        z-index: 100;
        margin-top: 0;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .fixed-ico img {
        height: 24px;
      }
     
  }
  
  @media (max-width: 1600px) {
      .history-num {
          width: 40%;
          margin-right: 5%;
      }
      .index-history-text span {
          font-size: 26px;
      }
      .index-history-text span b {
          font-size: 30px;
      }
      .index-history-text span:nth-child(1) b {
         margin-right: 20px;
      }
      .index-history-years span {
          font-size: 200px;
          line-height: 260px;
      }
      .index-history-years {
          position: relative;
      }
      .index-history-years::after {
          width: 100px;
          height: 15px;
      }
      .clients-box {
          max-width: 80%;
      }
  }
  
  @media (max-width: 1200px) {
      .index-history-text span {
          font-size: 26px;
      }
      .index-history-text span b {
          font-size: 30px;
      }
      .index-history-text span:nth-child(1) b {
         margin-right: 20px;
      }
      .index-history-years span {
          font-size: 140px;
          line-height: 200px;
      }
      .index-history-years {
          position: relative;
      }
      .index-history-years::after {
          width: 100px;
          height: 10px;
      }
  }
  
  @media (max-width: 990px) {
      .index-history-text span {
          font-size: 20px;
      }
      .index-history-text span b {
          font-size: 26px;
      }
      .index-history-text span:nth-child(1) b {
         margin-right: 10px;
      }
      .index-history-years span {
          font-size: 100px;
          line-height: 140px;
      }
      .index-history-years {
          position: relative;
      }
      .index-history-years::after {
          width: 100px;
          height: 10px;
      }
      .swiper-button-next, .swiper-button-prev:after{
          font-size: 30px;
      }
     
 .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
      color: #666;
      font-size: 30px;
      
  }
  .history-text{
      width: 100%;
  }
  
  }
  
  @media (max-width: 767px) {
      .navbar-default {
          margin-top: 0;
      }
      .navbar-collapse {
          background-color: #fff;
      }
      .navbar-brand {
          margin: 10px 0 0 15px;
          width: 115px;
          height: 30px;
      }
      .swiper-inner-banner-fonts {
          font-size: 30px;
      }
      .history {
          height: auto;
          flex-direction: column;
          margin: 40px 0;
      }
      .history-num {
          width: 90%;
          margin-right: 0;
          margin: 0 auto 0px;
      }
      .history-num::after {
          width: 40px;
          height: 5px;
      }
      .history-num-year {
          font-size: 80px;
          width: 100px;
          line-height: 70px;
          letter-spacing: -6px;
      }
      .history-num-year::before {
          content: '';
          display: block;
          width: 100%;
          height: 10px;
          background: #fff;
          position: absolute;
          left: 0;
          /* top: calc(0% - 10px); */
          top: 0px;
      }
      .history-num-year::after {
          content: '';
          display: block;
          width: 100%;
          height: 10px;
          background: #fff;
          position: absolute;
          left: 0;
          bottom: -9px;
      }
      .history-num-box:nth-child(2) .history-num-year {
          text-align: right;
          margin-right: 10px;
      }
      .index-history-text , .index-history-years{
          flex-direction: column;
          justify-content: center;
          align-items: center;
      }
      .history-num-letter {
          margin-right: 15px;
      }
      .index-history-text span {
          margin-top: 20px;
      }
      .index-history-years span {
          line-height: 200px;
      }
      .index-history-years::after {
          width: 100px;
          height: 8px;
      }
      .font-big {
          text-align: center;
      }
      .font-big p {
          font-size: 26px;
          letter-spacing: 0;
          line-height: 40px;
      }
      .font-line {
          margin: 20px 0;
      }
      .font-slogn p{
          font-size: 24px;
          /* text-align: center; */
      }
      .font-slogn span {
          display: block;
          font-size: 12px;
      }
      /*ÃƒÆ’Ã‚Â©Ãƒâ€šÃ‚Â¦ÃƒÂ¢Ã¢â€šÂ¬Ã¢â‚¬Å“ÃƒÆ’Ã‚Â¥Ãƒâ€šÃ‚Â±Ãƒâ€šÃ‚ÂÃƒÆ’Ã‚Â¨Ãƒâ€šÃ‚Â§ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â ÃƒÆ’Ã‚Â©Ãƒâ€šÃ‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã‹Å“*/
      .banner-video {
        height: auto;
      }
      .video-box {
        position: relative;
      }
      .video-box-play {
        position: absolute;
        right: 10px;
        bottom: 10px;
        z-index: 10;
        display: block;
        width: 20px;
        height: 20px;
        cursor: pointer;
      }
      .page-next {
        display: none;
      }
      .page-letter .line {
        font-size: 26px;
        line-height: 30px;
        height: auto;
        margin: 20px 0 -10px;
      }
      /* .page-letter .line {
          font-size: 28px;
          line-height: 30px;
          height: auto;
      } */
      .swiper-banner {
          width: 95%;
          margin: 0 auto;
      }
      .honor-box {
          margin: 20px 0;
      } 
      .honor-title {
          text-align: center;
      }
      .honor-title b {
          font-size: 24px;
          margin-bottom: 10px;
      }
      .honor-title span {
          font-size: 12px;
      }
      .honor-list {
          margin-top: 20px;
          margin-bottom: 20px;
      }
      .honor-list li {
          width: 100%;
          font-size: 16px;
      }
      .honor-history-box {
          padding-bottom: 40px;
          margin-bottom: 40px;
      }
      .honor-history {
          flex-direction: column;
          justify-content: center;
      }
      .honor-history-item {
          margin-top: 40px;
      }
      .honor-history-item span {
          font-size: 80px;
          line-height: 70px;
          letter-spacing: -5px;
      }
      .honor-history-item:nth-child(1) span::after {
          height: 70px;
          background: url(../images/num_right_m.png) no-repeat;
      }
      .swiper-banner .swiper-pagination {
          bottom: 10px;
      }
      .swiper-banner .swiper-pagination-bullet {
          width: 30px;
      }
      .case-list-more a {
          width: 40%;
          height: 40px;
          font-size: 18px;
          margin: 20px auto 0;
          border-radius: 10px;
      }
      .footer {
          margin-top: 40px;
          padding: 20px 0;
          font-size: 16px;
      }
      .footer-row {
          flex-wrap: wrap;
      }
      .footer-item {
          /*width: 50%;*/
      }
      .footer-item b span, .index-footer .footer-item b span {
          display: none;
      }
      .company-box {
          margin: 20px 0;
      }
      .company-title {
          text-align: center;
      }
      .company-title span {
          font-size: 20px;
          line-height: 20px;
      }
      .company-title h1 {
          font-size: 24px;
          margin: 20px 0;
      }
      .company-title b {
          font-size: 24px;
          margin: 20px 0;
      }
      .company-text p {
          font-size: 16px;
          line-height: 1.6;
          word-break: break-all;
      }
      .company-pic {
          margin-top: 0;
      }
      .company-pic, .clients-item {
          margin-bottom: 40px;
      }
      .clients-box {
          max-width: 98%;
      }
      .clients-item {
          width: 25%;
      }
      .clients-title {
          margin: 20px 0;
          text-align: center;
      }
      .clients-list-box .clients-title {
          margin: 60px 0 20px;
      }
      .clients-title b {
          font-size: 26px;
      }
      .clients-title span {
          font-size: 20px;
      }
      .case-position , .case-content-title{
          margin: 70px 0 20px;
          height: 40px;
          line-height: 40px;
          font-size: 20px;
      }
      .case-position , .case-back-ico {
        height: 30px;
        padding: 0;
      }
      .case-back-ico {
        width: 30px;
        background-color: #fff;
      }
      .case-back-ico , .case-back-ico img{
        border-radius: 50%;
        height: 30px;
      }
      .case-back-ico {
        position: fixed;
        top: 25px;
        z-index: 50;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .fixed-ico img {
        height: 20px;
      }
      .case-position span {
          margin: 0 10px;
      }
      .case-more-title {
          margin: 20px 0;
          font-size: 20px;
      }
      .case-content-title h1 {
          font-size: 24px;
          line-height: 40px;
      }
      .case-list-item-title span {
          font-size: 24px;
      }
      .case-more .case-list-item-name b {
        font-size: 18px;
      }

      .service-box {
          margin-top: 40px;
      }
      .service-title h1 {
          font-size: 20px;
          margin-bottom: 20px;
      }
      .service-title h1 b {
          margin-right: 10px;
      }
      .service-title span {
          font-size: 12px;
          word-break: break-all;
      }
      .service-desc {
          flex-direction: column;
      }
      .service-desc > div:nth-child(1) {
          margin-right: 0;
      }
      .service-desc b{
          display: block;
          font-size: 18px;
      }
      .service-desc p{
          font-size: 16px;
          margin: 10px 0;
      }
      .service-item {
          padding: 30px 0;
      }
      .service-item-img {
          margin-top: 20px;
      }
      .service-item-name b {
          font-size: 24px;
          margin-right: 10px;
      }
      .service-item:hover {
          display: flex;
          flex-direction: column;
          justify-content: center;
      }
      .service-item:hover .service-item-name b{
          font-size: 24px;
          margin-right: 10px;
      }
      .service-item:hover .service-item-name span{
          font-size: 14px;
          line-height: 15px;
      }
      .case-list-box {
          margin-top: 50px;
      }
      .case-more .col-md-3 {
          margin-bottom: 10px;
      }
      .news-title {
          margin-top: 20px;
      }
      .news-list-item {
          padding: 20px 0;
          flex-direction: column;
      }
      .news-list-item-img, .news-list-item-text, .news-list-item-date {
          width: 100%;
      }
      .news-list-item-text {
          padding: 20px 0;
      }
      .news-list-item-text b {
          font-size: 20px;
      }
      .news-list-item-text p {
          font-size: 16px;
      }
      .news-list-item-date {
          text-align: right;
      }
      .news-list-item-date span , .news-list-item-date i {
          display: inline-block;
          font-size: 16px;
          line-height: 20px;
          font-weight: normal;
      }
      .news-list-item-date i::before {
          content: '/';
      } 
      .pages a {
          width: 24px;
          height: 24px;
          margin-left: 6px;
          border-radius: 50%;
          font-size: 14px;
      }
      .news-content-title {
          margin-top: 70px;
          padding-bottom: 20px;
          border-bottom: 1px solid #000;
          margin-bottom: 20px;
          display: flex;
          flex-direction: column;
      }
      .news-content-title h1 {
          font-size: 20px;
          line-height:30px;
          margin: 0 0 10px;
      }
      .news-content-title span {
          display: block;
          font-size: 16px;
          line-height: 20px;
          text-align: right;
      }
      .news-content-back {
        margin-top:40px;
        padding-top: 20px;
        font-size: 18px;
        line-height: 24px;
      }
      .news-content-back a {
        padding-left: 40px;
      }
      .news-content-back a span {
        margin-right: 10px;
      }
      .contact-box {
          margin-top: 70px;
          display: flex;
          flex-direction: column;
          justify-content: baseline;
      }
      .contact-ewm {
          position: static;
          margin: 20px auto;
      }
      .contact-map {
          width: 100%;
          height: 500px;
      }
      .projcet-box {
          margin-top: 70px;
          display:flex;
          flex-direction: column-reverse;
          justify-content: space-between; 
      }
      .projcet-item {
          flex-direction: column;
      }
      .project-item-text-title span {
          font-size: 16px;
          line-height: 20px;
          margin-bottom: 20px;
      }
      .project-item-text-series {
          margin: 20px 0;
          font-size: 20px;
      }
      .project-item-img {
          width: 100%;
          padding: 0;
          margin-top: 20px;
      }
      .project-nav {
          display: flex;
          justify-content: space-between;
      }
  }