@charset "utf-8";
header .logo img{ width:120px; }
header .menubox{ margin-bottom:0 }
header .menubox>li{
    margin-left: 26px;
}
header .menubox>li>a{
    text-decoration:none;
    font-size: 16px;
}
.lanauage_wrap .lanbox a{
    font-size: 16px;
}
header .menubox>li:hover>a{
    color: #fff; 
}
header .menubox .active_title>a{
    color: #fff; 
}
.fix_header .menubox>li>a {
    color: #333;
}
.fix_header .menubox>li:hover>a {
    color: #1d2088;
}
.syvideotitle {
  position: absolute;
  z-index: 112;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -100%);
  color: #fff;
  font-size: 48px;
  font-weight: bold;
}
.bannerzhezao{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
    z-index: 11;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));

}
.index_banner .box .safe{
    display: none;
}
.mascotbox {
  bottom:10%;
}

.mascotbox .inner {
  min-height: 50px;
}
.mascotbox .inner:first-child{
    width: 50%;
}
.mascotbox .inner:last-child{
    width: 50%;
}
.mascotbox .inner p{
    font-size: 18px;
}

.mascotbox .svgbox {
  width: 30px;
  background: #1d2088;
}
.mascotbox .inner:first-child .svgbox{
    background: #eb5504;
    margin-right: 16px;
}
.mascotbox .inner:first-child p{
    margin-bottom:0;transform: unset !important;
}
.mascotbox .inner:last-child .svgbox{
    margin-right: 16px;
}
.mascotbox .inner:last-child p{
    margin-bottom:0;transform: unset !important;
}
.mascotbox .inner .svgbox img{
    transform: unset !important;
}

.mascotbox .inner:first-child:hover img{
    filter:unset;
}
.mascotbox .inner:last-child:hover img{
    filter:unset;
}

.title46{ font-size:36px; margin-bottom:20px; }
.title42{ font-size:32px; margin-bottom:20px; }

.h_two1 {
    padding: 80px 0px;
    position: relative;
    background-repeat: no-repeat;
    background-position: left top;
}

@media (max-width: 1600px) {
    .h_two1 {
        padding: 60px 0px;
    }
}

.h_two1 .box{
    display: flex; gap: 10px;
}
.h_two1 .l_box ,.h_two1 .r_box{
    width: 50%;
}
.h_two1 .title46{ margin-bottom:30px; text-align:center; }
.h_two1 .title46 span{ font-size:30px; color:#eee; font-family: 'Roboto-Regular'; text-transform:uppercase; display:block; }

.box_kapian{
    width:100%; position: relative; overflow: hidden;border-radius: 10px;
}
.box_kapian::before{
    content:"";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 50%;
    z-index: 2;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));transition: all 0.5s ease; 
}
.box_kapian:hover::before{
    height: 100%;    
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
}
.box_kapian img{
    width:100%; max-width: 100%;
    transition: all 350ms ease;
    transform: scale(1);
    height: 100%;object-fit: cover;
}
.box_kapian:hover img{
    transform: scale(1.06);
}
.box_kapian_text{
    position: absolute;
    position:absolute; z-index: 3;
    top: 30px; left: 30px;

}
.box_kapian_text h3{
     font-size: 24px; color: #fff;
     margin-bottom: 20px;
}
.box_kapian_text p{
    font-size: 16px; color: #fff;
}
.box_kapian a{
    position: absolute; left: 30px; bottom: 30px; z-index: 3;
    display: inline-block; width: 40px; height: 40px;
}
.box_kapian a img{
    width: 40px; height: 40px;
}

.h_two1 .r_box{ display:flex;flex-wrap: wrap; gap:10px; }
.box_kapian1{ height:100%; }
.box_kapian2{ width:100% }
.box_kapian3, .box_kapian4{ width:calc(50% - 5px); }

.h_one{ background:#f8f8f8 }
.h_one {
    padding: 80px 0px ;
    position: relative;
    background-repeat: no-repeat;
    background-position: left top;
}

@media (max-width: 1600px) {
    .h_one {
        padding: 60px 0px ;
    }
}
.h_one .box{align-items: center;}
.h_one .box .l_box{ height:100%; }
.h_one .title46{ margin-bottom:30px; text-align:center; }
.h_one .title46 span{ font-size:30px; color:#eee;    font-family: 'Roboto-Regular'; text-transform:uppercase; display:block; }

.h_one .safe .btn1{
    margin:0 auto; width: 150px; height: 50px;
}


.h_one .box{ width:100%;  margin-bottom:20px; }
.h_one .l_box{ width:100%; max-width:1000px; margin:0 auto; }
.sycompany{ height:100%; display:flex;flex-direction: column; }
.h_one .content{ text-align: center;
   -webkit-line-clamp: unset;
   margin: 0; line-height: 2;
}

.numberbox{
    background: none; box-shadow:none; max-width: 1000px; margin: 0 auto;
}
.numberbox ul{ padding-top:0; padding-bottom:20px; }
.numberbox .num{ font-size:48px; margin-bottom:0px; }
.numberbox .name{ font-size:16px; color:#666 }

.h_three{    padding-bottom: 100px;}
.h_three .bg{ object-fit: cover; }
.h_three .titlebox{
    justify-content: center; padding-top: 100px;
}
.h_three .title46{
    text-align: center;margin-bottom:0;
}
.h_three .title46 span{ font-size:30px; color:rgba(0, 0, 0,0.1);    font-family: 'Roboto-Regular'; text-transform:uppercase; display:block; }

.h_three .btnbox i{
    color: #333;
}

.h_three .swiper-pagination-bullet{
    border:1px #aaa solid;
}
.h_three .swiper-slide{
    align-items: center;
}
.h_three .imgbox{ width:50%; padding-left:5%; }
.h_three .r_box{ width:50%; padding-right:10%; padding-left:5%  } 

.h_three .title, .h_three .title a{
    color: #333;
}
.h_three .content{
    color: #666;
}

.h_three .btn{
    color: #00188f; border:1px #00188f solid;
    width: 150px; height: 50px;
}
.h_three .btn:hover{
        background-color: #00188f;
    color: #fff;
}

.service_case .titlebox{
    margin-bottom: 30px;justify-content: center;
}
.service_case .titlebox .title46{
    margin-bottom: 0;text-align: center;
}
.service_case .title46 span{ font-size:30px; color:rgba(0, 0, 0,0.1);    font-family: 'Roboto-Regular'; text-transform:uppercase; display:block; }
.service_case .btnbox{ justify-content: center; margin-top:40px; }
.service_case .btnbox i{
    background: #f5f5f5; width: 50px; height: 50px; font-size: 16px;
}
.service_case .swiper-slide{
    width: 23.4%;
}
.service_case .contact{
    position: absolute;
    bottom: 10px;
    padding: 30px;
    z-index: 3;
}

.service_case .content{
    font-size: 14px; color: #fff;
   -webkit-line-clamp: 2;
}
.service_case .title{ font-size:18px; margin-bottom:10px; }
.service_case .title a{
    color: #fff;
}

.service_case .imgbox{
    height: 400px; border-radius:10px; overflow: hidden;
}
.service_case .imgbox:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
    border-radius: 10px;
    z-index: 2;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
    transition: all 0.5s ease;
}
.service_case .imgbox:hover:before{
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
}

.service_case .imgbox a{
    display: block;
    width: 100%; height: 100%;
}
.service_case .imgbox a img{
    width: 100%; height: 100%; object-fit: cover;

}

.business_partner{ padding: 80px 0; }
.business_partner .title46{
    margin-bottom: 30px;text-align: center;
}
.business_partner .title46 span{ font-size:30px; color:rgba(0, 0, 0,0.1);    font-family: 'Roboto-Regular'; text-transform:uppercase; display:block; }

.business_partner .imgbox{
    border-radius: 10px;
    box-shadow:none;
}
.business_partner .imgbox:first-child{
    margin-bottom: 40px;
}

.business_partner .imgbox:nth-child(2){
    margin-bottom: 40px;
}

.synewscy{ padding:80px 0; }
.synewscy .title46{
    margin-bottom: 30px; font-size: 30px;
}
.synewscy .title46 span{ font-size:20px; color:rgba(0, 0, 0,0.1);    font-family: 'Roboto-Regular'; text-transform:uppercase; margin-left:10px; }
.synewscy .box{
    display: flex; gap: 40px;
}
.synewscy .l_box{
    width: 66.66%;
}
.synewscy .r_box{
    width: 33.33%;
}

.synewsbox{}
.synewsbox ul{ width:100%; }
.synewsbox ul li{ display:flex; margin-bottom:15px; width:50%; float: left; height: 125px;flex-direction: row-reverse;
background: #f8f8f8; padding: 10px;
}
.synewsbox ul li .l_synewsbox{ width:30%; border-radius:10px; overflow:hidden; }
.synewsbox ul li .l_synewsbox a{ display:flex; height:100%; width:100%; }
.synewsbox ul li .l_synewsbox a img{ width: 100%; height: 100%; object-fit: cover;transition: all 350ms ease;
    transform: scale(1);}
.synewsbox ul li:hover .l_synewsbox a img{transform: scale(1.05);}
.synewsbox ul li .r_synewsbox{ width:70%; padding-left:20px; }
.synewsbox ul li .r_synewsbox .title{
    font-size: 16px; color: #333; margin-bottom: 10px;
}
.synewsbox ul li .r_synewsbox .title a{
    font-size: 16px; color: #333; font-weight: normal; transition:all 0.5s ease;
}
.synewsbox ul li:hover .r_synewsbox .title a{
    color: #00188f; font-weight: bold;
}
.synewsbox ul li .r_synewsbox .contact{
    display: flex;flex-direction: column;justify-content: space-around;    height: 100%;
}
.synewsbox ul li .r_synewsbox .content{
    font-size: 14px; color: #aaa;
    line-height: 28px;
     display: none;
}
.synewsbox ul li .r_synewsbox .data{
    font-size: 14px; color: #aaa;
}

.synewsbox ul li:first-child{
   flex-direction: column; 
   height:420px; padding:0;padding-right: 20px; background: none;
}
.synewsbox ul li:first-child .l_synewsbox{ width:100%;
 border-bottom-right-radius: 0;border-bottom-left-radius: 0;
}
.synewsbox ul li:first-child .r_synewsbox{ width:100%; padding:20px; background: #f8f8f8; }
.synewsbox ul li:first-child .r_synewsbox .content{
    display: block;line-height: 28px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}


.cy_box{
    width: 100%;
    height: 420px;
}
.cy_box .cy_box_hot{
    width: 100%; height: 280px; margin-bottom: 20px;
    overflow: hidden; border-radius: 10px;
}
.cy_box .cy_box_hot .cy_box-video{
    width: 100%; height: 100%; object-fit: cover;
}
.cy_box .cy_box_ul{
    width: 100%;
    display: flex; gap: 10px;
}
.cy_box .cy_box_ul li{
    position: relative;
}
.cy_box .cy_box_ul li:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 50%;
    z-index: 2;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
    transition: all 0.5s ease;
    border-radius: 10px;
}
.cy_box .cy_box_ul li:hover:before{
    height: 100%; display: none;
}
.cy_box .cy_box_ul li a{ display:block;
    width: 100%; height: 100%; overflow: hidden; 
    border-radius: 10px;
}
.cy_box .cy_box_ul li a img{ width: 100%; height: 100%; object-fit: cover;transition: all 350ms ease;
    transform: scale(1);}
.cy_box .cy_box_ul li:hover a img{transform: scale(1.05);}
.cy_box .cy_box_ul li div{
    position: absolute; z-index: 2;padding: 15px; top: 10px;
}
.cy_box .cy_box_ul li div h3{ margin:0 0 6px; color:#fff; font-size:16px; }
.cy_box .cy_box_ul li div span{ font-size:12px; color:#fff; }


.sub-form .inp1, .sub-form .inp2{
    padding:0 15px 0px 30px;
    height:50px;
}
.sub-form .must::after{
    line-height: 50px; top: 0;
}
.sub-form .submit input{
    box-shadow:none; font-size: 16px;
}

.f-nav .title{ margin-bottom:25px; }
.f-nav li, .f-nav li a{ line-height:36px; font-size:14px; }
.f-nav .box4 li{ margin-bottom:12px; }

.page_banner{
    height: 600px; position: relative;
}
.page_banner:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: linear-gradient(180deg, rgba(0, 24, 143, 0.6), rgba(0, 24, 143, 0));
    transition: all 0.5s ease;
}
.page_banner2{
    height: 600px; position: relative;
}
.page_banner2:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: linear-gradient(180deg, rgba(0, 24, 143, 0.6), rgba(0, 24, 143, 0));
    transition: all 0.5s ease;
}
.page_banner2 .safe{
    z-index: 3;
}
.page_banner2 .title{
    font-size: 48px;
}
.page_banner2 .content{
    font-size: 18px;
}
.crumb1{
    position: relative;
    top: -80px;
    height: 80px;
    padding-top: 0;
    z-index: 4;
}
.crumb1 .safe{
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.9)); height: 80px;
    padding:20px;display: flex; align-items: center;
    border-top-right-radius: 10px;border-top-left-radius: 10px;
}
.crumb1 i{ margin:0 6px; }

.page_banner_text{ font-size:48px; color:#fff;
    position: absolute; left:50%;top:45%;
transform: translate(-50%, -50%); z-index: 3;
}
.creative-video .titlebox{
    margin-bottom: 30px;
}
.creative-video .title38{
    font-size: 36px;
}
.creative-video .wrap{
   display: block;height: 500px;
}
.creative-video .inner{
    float: left; margin-left: 3%; width: 37%;
    position: relative; height: 240px;
}
.creative-video .inner .inn{ width:100%; height:100%; }
.creative-video .inner .inn img{ width: 100%; height: 100%; object-fit: cover;transition: all 350ms ease;
    transform: scale(1);}
.creative-video .inner:hover .inn img{transform: scale(1.05);}
.creative-video .inn .video{ z-index:9 }
.creative-video .inner .inn:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50%;
    z-index: 2;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
    transition: all 0.5s ease;
}
.creative-video .inner:first-child{
    margin-left: 0;height: 500px;
    width: 60%;
}
.creative-video .inner:nth-child(2){
    margin-bottom: 20px;
}
.creative-video .inner .name{
    position: absolute; left: 40px; bottom: 40px;
    color: #fff;z-index: 8;
}

.creative-video .safe .btn3 {
    width: 150px;
    height: 50px;
}
.cerative-panorama .titlebox{
    margin-bottom: 30px;
}
.cerative-panorama .safe .btn3 {
    width: 150px;
    height: 50px;
}
.cerative-panorama .title38{
    font-size: 36px;
}
.creatice-download .titlebox{
    margin-bottom: 30px;
}
.creatice-download .safe .btn3 {
    width: 150px;
    height: 50px;
}
.creatice-download .title38{
    font-size: 36px;
}
.cerative-panorama .imgbox{
    overflow: hidden; border-radius: 10px;
}
.cerative-panorama .title{
    font-size: 16px; padding-top: 10px;
}

.creatice-download .wrap{
    display: flex;    flex-wrap: wrap;
    gap: 40px;
}
.creatice-download li{
    width: calc(50% - 20px); margin-bottom: 0;
    box-shadow:none; background: #f8f8f8; border-radius: 10px;
}

.creatice-download .title{
    margin-bottom: 0;
}

.cynav{
    padding: 80px 0 0;
}
.cynav .cynav_ul{
    background: #f8f8f8; border-radius: 10px;    
}
.cynav .cynav_ul ul{
    display: flex;
}
.cynav .cynav_ul li{
    width: 25%; display: flex; flex-direction:column;align-items: center; padding: 50px 0;
    position: relative; overflow: hidden; border-radius: 10px;
}
.cynav .cynav_ul li i{ position:relative; z-index:2; }
.cynav .cynav_ul li h3{ position:relative; z-index:2; font-size:24px; margin-bottom:15px; }
.cynav .cynav_ul li h3 a{ color:#333 }
.cynav .cynav_ul li span{ position:relative; z-index:2; color:#aaa; margin-bottom: 20px;}
.cynav .cynav_ul li b{position:relative; z-index:2;}
.cynav .cynav_ul li:before{
    content: "";
    position: absolute; z-index: 1;
    left: 0; bottom: 0;
    width: 100%;
    height: 0;
    background: linear-gradient(0deg, rgba(0, 24, 143, 0.1), rgba(0, 24, 143, 0));
    transition: all 0.5s ease;
}
.cynav .cynav_ul li:hover:before{
    height: 100%;
}
.cynav .cynav_ul li.active:before{
    height: 100%;
}
.company-innova{
    background: none;
}
.company-innova .title42{
    margin-bottom: 30px;
}
.company-innova .content p{
    margin-bottom: 40px; text-align: justify;
}

.company-video:before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: rgba(0, 0, 0, 0.6);
}
.company-video .video{
    z-index: 3;
}

.business-partner .box .imgbox{
    box-shadow:none;
    border-radius:10px;
}

.business-partner .title46{ margin-bottom:30px; text-align:center; }
.business-partner .title46 span{ font-size:30px; color:#eee; font-family: 'Roboto-Regular'; text-transform:uppercase; display:block; }

.company-menu .inner .title{
    letter-spacing: 0;
}

.company-history{ padding:50px 0; background:#f8f8f8 }
.company-history .r_box{ background:#fff; border-radius:10px;
padding:60px; }
.company-history .l_box .box { background:#fff; }
.company-history .swiper-slide-thumb-active .box {
    height: 100%;
    background-color: #00188f;
}
.company-history .content{ margin-bottom:0 }

.company-service{
    background: #f8f8f8;
}
.company-service .inner{
    background: #fff; border-radius: 10px; padding: 30px;
}
.company-service .wrap{
    justify-content: space-evenly;
}
.company-service .titlebox{
    justify-content: center;
    margin-bottom: 10px;
    position: relative; z-index: 2;
}
.company-service .inner .titlebox::before{ display:none; }
.company-service .inner .titlebox::after{ display:none; }
.company-service .contact{ position: relative; z-index: 2;padding:0;  text-align: center;}
.company-service .title{
    background: none;
    display: block;
    transform:translateX(0);
    margin-bottom: 0;
}
.company-service .content{
    color: #aaa;
}

.company-service .inner:before{
    content: "";
    position: absolute; z-index: 1;
    left: 0; bottom: 0;
    width: 100%;
    height: 0;
    background: linear-gradient(0deg, rgba(0, 24, 143, 0.1), rgba(0, 24, 143, 0));
    transition: all 0.5s ease;
}
.company-service .inner:hover:before{
    height: 100%;
}
.company-service .inner.active:before{
    height: 100%;
}

.company-team{
    background: #f8f8f8;
}

.company-team .title46{ margin-bottom:0; text-align:center; }
.company-team .title46 span{ font-size:30px; color:#eee; font-family: 'Roboto-Regular'; text-transform:uppercase; display:block; }
.company-team .titlebox{
    justify-content: center;
}
.shigeli ul li{
    display: flex; 
}
.shigeli ul li .shigeli_img{ width:50% }
.shigeli ul li .shigeli_text{width:50%; display:flex;flex-direction: column;
    justify-content: center; padding:0 40px}

.shigeli ul li .shigeli_text h3{
    font-size: 24px; margin-bottom: 20px; color: #00188f;
    margin-top: 0;
}
.shigeli ul li .shigeli_text h4{
    font-size: 18px; margin-top: 30px; margin-bottom: 15px; color: #00188f;
}
.shigeli ul li .shigeli_text p{
    font-size: 16px; color: #888; line-height: 2;
}

.quality-system .content{
    font-size: 16px; color: #333;
    line-height: 2; margin:0 auto; max-width: 1300px;
    text-align: justify;
}
.quality-system .content img{
    display: inline-block;
}

.znzz-box{
    background: #f8f8f8; padding: 80px 0;
}
.znzz-box .content{ text-align:center; font-size:18px; }
.company-certicicate .inner{
    width: calc(33.33% - 28px); margin-right: 40px;
}
.company-certicicate .inner:nth-child(3n){
    margin-right: 0;
}

.company-industry{
    background: #f8f8f8; padding: 80px 0;
}
.company-industry .title46{ margin-bottom:30px; text-align:center; }
.company-industry .content{ text-align:center; font-size:16px; color: #666; line-height: 2; margin-bottom: 30px;
}

.project-case .title a{
    color: #333;
}
.project-case .content{
    line-height: 2; color: #888; font-size: 14px;
}

.project-case .btn1{
    width: 150px;
    height: 50px;
}

.project-case .swiper-slide{
    align-items: center;
}

.othre-cases{
    padding: 80px 0; margin-bottom: 0;
}
.project-obj{
    padding: 77px 0;
}
.project-obj .btn1{
    width: 150px;
    height: 50px;
}
.project-obj .content{
    line-height: 2;
    -webkit-line-clamp:10;
}
.project-high .box{ margin-bottom:0 }

.news-detail .safe{
    background: none; padding: 0;
}
.news-detail .titlebox{
    padding-bottom: 30px;
}
.news-detail .title{
    margin-top: 0; margin-bottom: 20px;
}
.news-detail .mount{
    color: #aaa;
}
.news-detail .wrap{
    width: 100%; background: none;
    display: flex;justify-content: space-between;
    padding-top: 0;
}
.page-control{
    display: flex;justify-content: space-between;
}
.page-control .con i{
    font-size: 16px; margin:0 8px;
}
.page-control .con p, .page-control .con p a{
    font-size: 16px; line-height: 1.5;
}
.news-detail .content{
    margin-bottom: 60px;
}

.creative3-list{ margin-top:0 }
.creative3-list .inner a{ line-height:3; font-size:16px; color:#333; display:block; text-align:center; }

.company-innova .r_box img{
    border-radius: 10px;
}

.company-innova .r_box::after{
    border-radius: 10px;
}

.h_three .content p {
    padding-left: 15px;
}
.h_three .content p::after {
    background-color: #00188f;
}

.company-honor .swiper-slide{
    align-items: center;
    border:1px #eee solid; border-radius: 10px; overflow: hidden;
}
.company-honor .swiper-slide img{ aspect-ratio: 1 / 1 ;
object-fit: contain; }

.company-honor .swiper-pagination{
    display: block;
}
.company-three1{ padding:60px 0 }
.company-three1 .certificate_swiper2 .swiper-wrapper{
    align-items: center;
}
.company-three1 .certificate_swiper2 .swiper-slide{
    align-items: center;
    border:1px #eee solid; border-radius: 10px; overflow: hidden;
}
.company-three1 .certificate_swiper2 .swiper-slide img{ aspect-ratio: 2 / 1 ;
object-fit: contain; }


.company-three .title46{
     text-align: center;
    margin-bottom: 40px;
    position: relative; z-index: 2;
}

.company-three1 .title46{
    text-align: center;
    margin-bottom: 40px;
    position: relative; z-index: 2;
}

.service-case .title46{
    text-align: center;
    margin-bottom: 40px;
    position: relative; z-index: 2;
}

.product-chorda .title46{
    text-align: center;
    margin-bottom: 40px;
    position: relative; z-index: 2;
}

.product-one{ background:#f8f8f8 }
.product-two .box{align-items: center; gap: 20px}
.product-two .l_box{ padding-top:0;}
.product-two .r_box{ width:50%; max-width:50%; }
#circlr{ min-height:500px; display: flex; align-items: center;}
.product-three .r_box img{
    border-radius: 10px; overflow: hidden;
}

.product-two .title40{ font-size:36px; }
.product-key .title38{ font-size:36px; }
.product-device .title38{ font-size:36px; }
.product-unit .title38{ font-size:36px; }

.product-four{ padding:80px 0px 60px }
.product-four li{ font-size:24px }
.product-chorda .title{ top:unset; bottom:0; padding: 0 12px 21px 20px;}
.product-chorda .inner::after{
    content: "";
    position: absolute;
    left: 0;
    top: unset;
    bottom: 0;
    width: 100%;
    height: 30%;
    z-index: 2;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
    transition: all 0.5s ease;
}
.product-chorda .inner:hover::after{
    height: 100%;    
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));
}

.relevant-product{ background:#f8f8f8;padding:80px 0px 60px }
.relevant-product .title a{ color:#333; }
.relevant-product .btn{ text-align:left; padding:0; width:auto; height:auto; }
.relevant-product .btn:hover{
    background: none;
}
.relevant-product .l_box img{ border-radius: 10px; border:1px #ddd solid; }



@media (max-width: 768px) {
    header>.safe{
    padding-right: 26%;
    }
    .syvideotitle{
        font-size: 26px;
    }
    .title46{
        font-size: 26px;
    }
    .title46 span{
        font-size: 16px;
    }
    .h_two1{ padding:30px 0; }
    .h_one{ padding:30px 0; }
    .h_two1 .title46{ margin-bottom:16px; }
    .h_two1 .title46 span{
        font-size: 16px;
    }
    .h_one1 .title46{ margin-bottom:16px; }
    .h_one1 .title46 span{
        font-size: 16px;
    }
    .h_one .title46{ margin-bottom:16px; }
    .h_one .title46 span{
        font-size: 16px;
    }
    .h_three .title46{ margin-bottom:16px; }
    .h_three .title46 span{
        font-size: 16px;
    }
    .business_partner .title46{ margin-bottom:16px; }
    .business_partner .title46 span{
        font-size: 16px;
    }
    .synewscy .title46{ margin-bottom:16px; font-size: 26px; text-align: center;line-height: 1;}
    .synewscy .title46 a{ display:block; }
    .synewscy .title46 span{
        font-size: 16px; margin-left: 0;
    }
    .business_partner .title46{ margin-bottom:16px; }
    .business_partner .title46 span{
        font-size: 16px;
    }
    .service_case .title46{ margin-bottom:16px; }
    .service_case .titlebox{ margin-bottom:16px; }
    .service_case .title46 span{
        font-size: 16px;
    }
    .syvideotitle{
        margin:0;
        transform: translate(-50%, -150%);
        width: 100%; text-align: center;
    }
    .mascotbox{ width:90%; }
    .mascotbox .inner{ padding:10px 15px; }
    .mascotbox .inner p{ font-size:16px; }
    .h_two1 .box{    flex-direction: column;}
    .h_two1 .l_box, .h_two1 .r_box{
        width: 100%;
    }
    .box_kapian_text{ top:20px; left:20px; }
    .box_kapian_text h3{ font-size:18px; margin-bottom:16px; }
    .box_kapian_text p{ font-size:14px; }
    .box_kapian a{
       top: 50%; bottom: unset; right:30px; left: unset;transform: translate(0, -50%);
    }
    .box_kapian3, .box_kapian4{ width:100%; }
    .box_kapian img{aspect-ratio: 2 / 1;}
    .box_kapian::before{ height:100%; width:100%; background: linear-gradient(90deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0));}
    .box_kapian:hover::before{
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.2));
    }

    .numberbox .num{font-size: 28px;}
    .h_three .titlebox{ padding-top:0 }
    .h_three{ padding-bottom:0; }
    .h_three .imgbox{ width:80%; padding-left:0; }

    .service_case .imgbox{ height:auto; }
    .service_case .imgbox:before{ display:none; }
    .service_case .swiper-slide{ width:100%; }
    .service_case .imgbox a img{aspect-ratio: 4 / 3 }
    .service_case .contact{
        position: relative; bottom: unset;
        padding: 16px 0;
    }
    .service_case .title a{ color:#333; font-size:16px; } 
    .service_case .content{ color:#888; font-size:14px; }
    .service_case .btnbox{ margin-top:20px; }

    .business_partner{
        padding:30px 0;
    }
    .business_partner .imgbox:first-child{ margin-bottom:16px; }
    .business_partner .imgbox:nth-child(2){ margin-bottom:16px; }
    .synewscy{ padding:30px 0; }
    .synewscy .box{ flex-wrap: wrap; }
    .synewscy .l_box{ width:100% }
    .synewscy .r_box{ width:100% }
    .synewsbox ul li{ width:100%;flex-direction: row; height: 100px;}
    .synewsbox ul li:first-child{
        flex-direction: row;
        height: 100px; padding: 10px;
        background: #f8f8f8;
    }
    .synewsbox ul li:first-child .r_synewsbox{width: 70%;padding:0 0 0 20px;}
    .synewsbox ul li:first-child .l_synewsbox{
        width: 30%;border-radius: 10px;
    }
    .synewsbox ul li:first-child .r_synewsbox .content{
        display: none;
    }
    .cy_box{ height:auto; }
    .cy_box .cy_box_hot{ height:220px; }
    .cy_box .cy_box_ul li div{ top:0; padding: 15px 8px; }

    .page_banner{
        height: 200px;
    }
    .page_banner_text{
        font-size: 26px;
    }
    .crumb1{
        height: 40px; top: -40px;
    }
    .crumb1 .safe{
        height: 40px; padding:5px 10px;
        border-top-right-radius:4px;
        border-top-left-radius:4px;
    }
    .company-innova .title42{
        font-size: 26px;
    }
    .company-innova .content p{
        margin-bottom: 20px;
    }
    .business-partner .title46 span{
        font-size: 16px;
    }
    .company-history .r_box{
        padding: 20px;
    }
    .company-service .inner{
        padding: 10px;
    }

    .company-service .svgbox{
        width: 40px;
    }
    .company-service .inner{
        margin-bottom: 10px;
    }
    .yolortitle span{
        font-size: 26px !important;
    }
    .shigeli ul li{
        flex-direction: column;
    }
    .shigeli ul li:nth-child(2n){
        flex-direction: column-reverse;
    }
    .shigeli ul li .shigeli_img{ width:100% }
    .shigeli ul li .shigeli_text{ width:100%; padding:20px 0 }
    .shigeli ul li .shigeli_text h3{ font-size:20px; margin-bottom:10px;border-left: 3px #00188f solid;padding-left: 10px; }
    .shigeli ul li .shigeli_text p{ font-size:14px; line-height:1.5 }
    .shigeli ul li .shigeli_text h4{ font-size:16px; margin-top:15px; margin-bottom:10px; }
    .company-certicicate .wrap{
        
    }
    .znzz-box{
        padding: 40px 0;
    }
    .company-certicicate .inner{
        width: 48%; margin-bottom: 10px; margin-right: 2%;
    }
    .company-certicicate .safe {
        width: calc(100% - 30px);
    }

    .company-industry{
        padding: 40px 0;
    }
    .company-industry .content{
        line-height: 1.5;
    }

    .page_banner2{
        height: 250px;
    }
    .page_banner2 .title{
        font-size: 26px;
    }
    .page_banner2 .content{
        font-size: 14px; line-height: 1.5;
    }
    .product-one .con{ padding-bottom:30px; }
    .product-two .title40{ font-size:26px; }
    .product-two .r_box{ width:100%;max-width: 100%; }
    .product-panorma{ padding:0; }
    .product-panorma .container{ padding:15px 0; }
    .product-panorma .col-lg-8,.product-panorma .col-md-10,.product-panorma .col-sm-12{ padding:0; }
    .product-panorma .panel{
        margin-bottom: 0;
    }
    .product-panorma .panel-body{ padding:15px 0 }
    .product-panorma #circlr{
        min-height: unset;
    }
    .product-panorma .panel-body img{
        min-height: unset;
    }
    .product-key .title38{
         font-size:26px;
    }
    .product-device .title38{
         font-size:26px;
    }
    .product-unit .title38{
         font-size:26px;
    }
    .product-four{ padding:30px 0px }
    .product-four li{ font-size:18px; }
    .news-detail .titlebox{ padding-bottom:15px; }
    .cynav{ padding:20px 0; }
    .cynav .cynav_ul ul{flex-wrap: wrap; background: #fff}
    .cynav .cynav_ul li{ width:calc(50% - 10px);padding: 20px 0; margin:5px;  background: #f8f8f8}
    .cynav .cynav_ul li i img{ width:40px; }
    .cynav .cynav_ul li h3{ font-size:18px; margin-bottom:5px; margin-top:10px; }
    .cynav .cynav_ul li span{ margin-bottom:10px; line-height:1.5 }
    .cynav .cynav_ul li:before{ display:none; }

    .creative-video .titlebox{ margin-bottom:15px; }
    .cerative-panorama .titlebox{ margin-bottom:15px; }
    .creatice-download .titlebox{ margin-bottom:15px; }
    .creative-video .title38{
         font-size:26px;
    }
    .cerative-panorama .title38{
         font-size:26px;
    }
    .creatice-download .title38{
         font-size:26px;
    }
    .creative-video .safe .btn3{
        height: 45px; width: 120px;
    }
    .cerative-panorama .safe .btn3{
        height: 45px; width: 120px;
    }
    .creatice-download .safe .btn3{
        height: 45px; width: 120px;
    }

    .creative-video .wrap{ height:auto; display:flex; flex-wrap:wrap; }
    .creative-video .inner{
        width: 100%; height: 160px; margin-left: 0; margin-bottom: 10px;
    }
    .creative-video .inner:nth-child(2){ margin-bottom: 10px;}
    .creative-video .inner:first-child{
        width: 100%; height: 160px;
    }
    .creative-video .inner .name{ left:20px; bottom:20px; margin-bottom:0; }
    .creative-video .inn .video img{
        width: 60%; height: 60%; margin: 0 auto;
    }

    .creatice-download .wrap{ gap:15px; }
    .creatice-download li{ width:100%;flex-direction: row;
    align-items: center;
    justify-content: space-between;        padding: 0 15px; }
    .creatice-download li .contact{ margin-bottom:0; }
    .creatice-download .download img{ max-width:50% }
    .mapbox iframe{
        max-width: 100%;
    }
}

@media (max-width: 500px) {
    .company-service .svgbox{
        width: 40px;
    }
    .creatice-download li .contact{ margin-bottom:0; }

}

@media (max-width: 500px) {
    .company-certicicate{
        padding: 30px 0px 0;
    }

}