@font-face{ font-family: LiberationSans-Bold; src: url(../font/LiberationSans-Bold.ttf);}
@font-face{ font-family: LiberationSans-Regular; src: url(../font/LiberationSans-Regular.ttf);}
.txtovh1{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.txtovh2{overflow: hidden;-webkit-line-clamp: 2;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
.txtovh3{overflow: hidden;-webkit-line-clamp: 3;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
.txtovh4{overflow: hidden;-webkit-line-clamp: 4;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;}
.img_db{ width: 100%; position: relative;}
.img_db:after{ content: ""; display: block; width: 100%; height: 0; padding-top: 60.9%; position: static !important;}
.img_db img{ position: absolute; left: 0; top: 0; width: 100%;  object-fit: cover;} 
.img_db .pic{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.img_db .pic img{ position: static; width: auto; height: auto; object-fit: contain;}
.s_banner{ width: 100%; position: relative;}
.s_banner .swiper-container{ height: 750px; width: 100%; overflow: hidden;}
.s_banner .swiper-slide{ width:100%; height: 750px; z-index: 1;}
.s_banner .bg{ position: absolute; left: 0; top: 0; width:100%; z-index: -1; height: 100%; background-size: cover !important; }
.s_banner .bg:before{ content: ""; display: block; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2);}
.s_banner .swiper-slide .m{ height: 100%; display: flex; justify-content: center; align-items: center; }
.s_banner .swiper-slide .txt{}
.s_banner .swiper-slide .txt h5{ font-size: 3.75rem; color: #d80930; text-transform: uppercase; text-align: center; font-family: LiberationSans-Bold;}
.s_banner .swiper-slide .txt h4{ font-size: 4.375rem; color: #fff; font-family: "思源黑体","微软雅黑"; margin-bottom: 1.25rem; text-align: center; font-weight: 900;}
.s_banner .swiper-slide .txt span{ text-align: center;letter-spacing: 3.9px; font-size: 1.3125rem; font-family: LiberationSans-Regular; text-transform: uppercase; color: #fff; display: block;}
.s_banner .arr{ position: absolute; z-index: 99; cursor: pointer; display: flex; align-items: center; justify-content: center; top: 50%; transform: translateY(-50%); width: 3.75rem; height: 3.75rem; border-radius: 50%; border: 1px solid #fff;}
.s_banner .bn_left{ left: 10%;}
.s_banner .bn_right{ right: 10%;}
.s_banner .arr svg{ width: 10px; height: 10px;}
.s_banner .arr svg path{ fill: #fff;}

.s_banner .txt h5{ opacity: 0; }  
.s_banner .txt h4{ opacity: 0; }  
.s_banner .txt span{ opacity: 0; }  
.s_banner .swiper-slide.swiper-slide-active .txt h5{ animation: enter 1.2s forwards .1s;} 
.s_banner .swiper-slide.swiper-slide-active .txt h4{ animation: enter 1.2s forwards .2s;} 
.s_banner .swiper-slide.swiper-slide-active .txt span{ animation: enter 1.2s forwards .3s;} 
@-webkit-keyframes enter {
  0% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
  20% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
  100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
}
@keyframes enter {
  0% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
  20% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
  100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
}

.pad_top{ padding-top: 3.5rem;}
.pad_bot{ padding-bottom: 3.0rem;}

.s_hd{ display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 3.75rem;}
.s_tt{}
.s_tt i{ display: block; width: 21px; height: 2px; background: #d80930;}
.s_tt span{ font-size: 1.5rem; font-family: LiberationSans-Bold; color: #d80930; text-transform: uppercase; display: block; margin-top: 1.375rem; margin-bottom: .625rem; }
.s_tt h3{ font-size: 1.875rem; color: #000000; font-weight: bold;}

.btn_arr3 {
    display: block; 
    overflow: hidden;
    position: relative; 
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
  }

  .btn_arr3 font {
    display: block;
    width: 100%;
    height: 100%;
    line-height: 45px;
    text-align: center;
    position: absolute;
    top: 0;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
  }

  .btn_arr3 font:nth-child(1) {
    left: -50px;
  }

  .btn_arr3 font:nth-child(2) {
    left: 0;
  }

  .btn_arr3 font svg path {
    fill: #fff;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
  }

  .btn_arr3 font svg {
    display: inline-block;
 
    vertical-align: middle;
  }
 
  .btn_arr3:hover font:nth-child(1) {
    left: 0;
  }

  .btn_arr3:hover font:nth-child(2) {
    left: 50px;
  }

 

.s_btn_r{ display: flex; align-items: center; justify-content: center; width: 51px; height: 51px; border-radius: 3px; background: #d80930;}
.s_btn_r svg{ width: 24px;}
.s_btn_r svg path{ fill: #fff;}
.s_about{ width: 100%; overflow: hidden;}
.s_about .s_bd{ display: flex;}
.s_about .s_bd .left{ width: 470px;}
.s_about .s_bd .right{ margin-left: 168px; display: flex; align-items: center;}

.s_about .tt{ margin-bottom: 3.75rem;}
.s_about .tt h5{ font-size: 16px; color: #696969; font-weight: bold; text-transform: uppercase; display: flex; align-items: center;}
.s_about .tt h5 i{ display: block; width: 34px; height: 3px; background: #696969;  margin-right: 14px;}
.s_about .tt h3{ font-size: 30px; color: #49494a; font-weight: bold; margin-top: 36px; margin-bottom: 12px;}
.s_about .tt h4{ font-size: 1.125rem; color: #d80930; text-transform: uppercase; font-weight: bold;}
.s_about .con{ font-size: 14px; line-height: 30px; color: #4f4f51;}

.about_img{ position: relative;}
.about_img img{ display: block;}
.s_about .btn_box{ position: absolute; bottom: 40px; right: -128px; }
.about_video_play{ position: absolute; left: 50%; top: 47%; transform: translateX(-50%) translateY(-50%); display: block; }
.about_video_play p{ text-align: center; font-size: 21px; color: #000000; margin-bottom: 20px; font-family: LiberationSans-Regular;}
.about_video_play span{ margin: 0 auto; display: flex; position: relative; z-index: 1; width: 37px; height: 37px; align-items: center; justify-content: center; }
.about_video_play span:before{ content: ""; display: block; width: 100%; height: 100%; transition: .3s; position: absolute; left: 0; top: 0; z-index: -1; border-radius: 50%; background: #d80930;}
.about_video_play svg{}
.about_video_play svg path{ fill: #fff;}
.btn_box:hover span:before{ transform: scale(1.3);}
.pro_img:after{ padding-top: 75%;}
.s_pro{}
.s_pro ul{ display: flex; flex-wrap: wrap; margin: -12px;}
.s_pro ul li{ width: 33.33%; padding: 12px;}
.s_pro ul li .box{ background: #e9ecef; display: block; box-shadow: 0px 3px 26px 0px rgba(0, 0, 0, 0.05); transition: .5s;}
.s_pro ul li .txt{ padding: 20px;}
.s_pro ul li .txt h4{ font-size: 1.125rem; color: #464646; transition: .5s; margin-bottom: 13px;}
.s_pro ul li .txt p{ font-size: 14px; line-height: 24px; height: auto; overflow: hidden; color: #8f8d8d; transition: .5s; margin-bottom: 16px;}
    .s_pro ul li .txt div {
        transition: .5s;
    }


.s_pro ul li:hover .box{ background: #d70a30; transform: translateY(-30px);  box-shadow: 0px 3px 26px 0px rgba(0, 0, 0, 0.33);}
.s_pro ul li:hover .box .txt h4{ color: #fff;}
.s_pro ul li:hover .box .txt p{ color: #fff;}
.s_pro ul li:hover .box .txt div{ color: #fff;}

.index_bg1{ background: url(../image/index_bg1.jpg) center no-repeat; background-size: cover;}
.s_case{ width: 100%; background: url(/images/index/case_bg2.jpg) center no-repeat; background-size: cover; background-attachment: fixed;}
.s_case .s_tt h3{ color: #fff;}
.s_case ul{  overflow: hidden; display: grid; grid-template-columns: repeat(3,1fr); gap: 38px;}
.s_case ul li{  overflow:hidden; position:relative; float:left; }
.s_case ul li .box{ position: relative; display: block; overflow: hidden;}
.s_case ul li img{ width:100%; height:auto;max-height:450px;max-width:600px; transition:1s; -webkit-transition:1s; -moz-transition:1s; -ms-transition:1s;-o-transition:1s;}
.s_case ul li:hover img{ transform:scale(1.1);}
.s_case ul li h5{ min-width:193px; max-width: 90%; padding: 0 20px; height:40px; line-height:40px; text-align:center; background:#d80930; background: rgba(216,9,48,.9); color:#fff; font-size:14px; position:absolute; left:0; bottom:18px; transition:.5s; -webkit-transition:.5s; -moz-transition:.5s; -ms-transition:.5s;-o-transition:.5s;}
.s_case ul li:hover h5{ bottom:0;}
.s_case .s_btn_r{ background: #fff;}
.s_case .s_btn_r svg path{ fill: #d80930;}
.s_faq{ width: 100%; background: url(../image/s_faq_bg.jpg) center no-repeat; background-size: cover; }
.s_faq ul{}
.s_faq ul li{ position:relative; height:135px; }
.s_faq ul li+li{ margin-top: 10px;}
.s_faq ul li .riqi{ background: #fff; transition: .5s; position:absolute; width:92px; height:72px; top:35px; font-size:30px; color:#d61b3d; font-weight: bold; font-family: arial; box-sizing:border-box; text-align:center; font-family:arial; padding-top:12px;}
.s_faq ul li .riqi span{ display:block; font-size:12px; color:#000000; font-weight: normal; font-family:arial; transition: .5s; margin-top: 4px;}
.s_faq ul li .txt{ padding-left:80px; margin-left:46px; height:135px; padding-right:20px; transition: .5s;}
.s_faq ul li .txt h5{ padding-top:32px; margin-bottom:18px; font-size:18px; color:#171616;}
.s_faq ul li .txt p{ font-size:13px; color:#9c9f9f; line-height:24px; height:48px; overflow:hidden;}
.s_faq ul li:hover .txt{ background:#fff; }
.s_faq ul li:hover .riqi{ background:#d80930; color:#fff;}
.s_faq ul li:hover .riqi span{ color:#fff;}
.s_faq ul li h5:hover{ color:#111;}