body{ margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; min-width: 991px;}
html{ scroll-behavior:smooth; }
ul{ margin: 0; padding: 0;}
li{ list-style: none;}
.fl{ float:left;}
.fr{ float:right;}
.clear{ clear:both;}
.cl:after{ content: ''; clear: both; display: table;}
a{ text-decoration: none !important;}


.fudong_right{ position: fixed; right: 0; top: 20%; z-index: 998;}
.fudong_right ul li{ width: 55px; height: 55px; border-bottom-left-radius: 4px; border-top-left-radius: 4px; background: #414141; margin-bottom: 1px;  transition: all 0.3s; position: relative;}
.fudong_right ul li a{ display: block; width: 100%; display: block; height: 55px; line-height: 55px; color: #fff; text-align: center; transition: all 0.3s;}
.fudong_right ul li a i{ display: inline-block; font-size: 24px; line-height: 55px;}
.fudong_right ul li:hover{ background: #119e96;}
.fudong_right ul li:hover a{ color: #fff;}

.fudong_right ul li:first-child span{ background: #119e96; height: 55px; line-height: 55px; font-size: 16px; font-weight: bold; color: #fff; width: 160px; position: absolute; left: 100%; top: 0; transition: all 0.3s; text-align: center; letter-spacing: 2px;}
.fudong_right ul li:first-child:hover a{ margin-left: -160px; background: #119e96; border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
.fudong_right ul li:first-child:hover span{ left: -115px;}
.fudong_right ul li:nth-child(2) span{ background: #414141; padding: 5px; width: 120px; height: 120px; position: absolute; left: 100%; top: 0; transition: all 0.3s; display: block; z-index: -1;}
.fudong_right ul li:nth-child(2) span img{ display: block; width: 100%;}
.fudong_right ul li:nth-child(2):hover span{ left: -120px;}





.header{ width: 100%; box-shadow:0px 1px 4px rgba(0,0,0,0.1); position:fixed; top:0; left:0; right:0; margin:0 auto; z-index:999; background:rgba(0,0,0,0.34); height: 84px;}
.header .container{ position: relative; width: 100%; padding-left: 25%; padding-right: 20.8%;}
.logo{ position: absolute; left: 35px; top: 0; height: 84px;}
.logo a{ display: block; height: 100%;}
.logo a img{ height: 100%; display: block; max-width: 100%;}
.pc_nav>ul{ text-align: left; font-size: 0;}
.pc_nav>ul>li{ display: inline-block; margin-right: 40px;}
.pc_nav>ul>li>a{ display: block; line-height: 84px; height: 84px; padding: 0; position: relative; font-size: 20px; color: #fff; text-transform: uppercase; transition: all 0.3s;}
.pc_nav>ul>li.active>a{ color: #119e96;}
.pc_nav>ul>li>a:hover{ color: #119e96;}
.pc_nav>ul>li>a:after{ content: ''; width: 100%; height: 4px; background: #119e96; position: absolute; bottom: 0; left: 0; z-index: 2; opacity: 0; transition: all 0.3s;}
.pc_nav>ul>li.active>a:after{ opacity: 1;}

.erji{ position: absolute; left: 0; top: 100%; z-index: 2; width: 100%;}
.ej_li{ transition: all 0.3s; opacity: 0; pointer-events: none; position: absolute; left: 0; top: 15px; width: 100%; background: rgba(0,0,0,0.65); padding: 15px 0;}
.ej_li a{ display: inline-block; margin-right: 15px; font-size: 14px; color: #fff;}
.ej_li a:hover{ color: #119e96;}
.ej_li.cur{ opacity: 1; pointer-events: auto; top: 0;}


.nav_more{ position: absolute; right: 0; top: 0; height: 84px; width: 136px; transition: all 0.3s;}
.nav_ss{ position: absolute; right: 0; top: 0; height: 84px; line-height: 84px; width: 136px; background: #119e96; color: #fff; transition: all 0.3s; overflow: hidden;}
.nav_ss button{ width: 70px; height: 84px; margin: 0 auto; text-align: center; display: block; border: none; background: none; outline: none;}
.nav_ss button i{ display: inline-block; line-height: 84px; font-size: 36px; z-index: 2; transition: all 0.3s;}
.nav_ss.active{ width: 300px;}
.nav_ss.active .ss_right{ opacity: 1; width: 30px;}
.ss_right{ display: block; height: 84px; position: absolute; top: 0; left: 0; width: 100%; z-index: 2; transition: all 0.3s; text-align: center; opacity: 0; background: rgba(255,255,255,0.3); cursor: pointer;}
.ss_right i{ display: inline-block; line-height: 84px; font-size: 18px;}
.nav_ss input{ width: 160px; background: none; border: none; border-bottom: 1px solid rgba(255,255,255,0.5); position: absolute; left: 136px; top: 50%; transform: translateY(-50%); opacity: 1; transition: all 0.3s; height: 36px; outline: none; font-size: 18px;}
.nav_ss.active input{ left: 100px; opacity: 1;}
.nav_ss.active button{ margin-left: 30px;}

.nav_lang{ position: absolute; right: calc(100% + 15px); top: 50%; transform: translateY(-50%); }
.nav_lang a{ display: inline-block; padding: 0 25px; font-size: 22px; line-height: 30px; border-left: 1px solid #fff; color: #fff;}

.s_banner{ position: relative;}
.s_banner .swiper-slide a video{ position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; width: 100%;}

.video_kg{ position:absolute; width:40px; height:40px; background:url(../image/cnm_4.png) center center no-repeat rgba(219,174,96,1); border-radius:50%; left:65px; bottom:30px; z-index:10; border:none; outline:none;}
.video_kg.active{ background:url(../image/cnm_3.png) center center no-repeat rgba(219,174,96,1);}
.video_sy{ position:absolute; width:40px; height:40px; background:url(../image/cnm_2.png) center center no-repeat rgba(219,174,96,1); border-radius:50%; left:15px; bottom:30px; z-index:10; border:none; outline:none;}
.video_sy.active{ background:url(../image/cnm_1.png) center center no-repeat rgba(219,174,96,1);}

video#sVideo2{ height: 500px !important;}
.video_big{ cursor: pointer; position: absolute; max-width: 16%; bottom: 30px; right: 30px; z-index: 10;;}
.video_big img{ display: block; max-width: 100%;}

@media (max-width:767px){
    video#sVideo2{ height: 300px !important;}
}




.s_banner .swiper-slide a{ padding-top: 41.66%; display: block; width: 100%;}
.s_banner .swiper-button-prev, .s_banner .swiper-button-next{ width:56px; height:56px; background: none;
     
      color:#fff; text-align:center; line-height:56px;}
.s_banner .swiper-button-prev i, .s_banner .swiper-button-next i{ display: inline-block; line-height: 56px; font-size: 46px;}
.s_banner .swiper-button-prev{ left: 5%;}
.s_banner .swiper-button-next{ right: 5%;}

.s_about{ padding: 90px 0; background: url(../image/x22_1.jpg) center no-repeat; background-size: cover;
    display: flex;
    display: -webkit-flex;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.s_about .caption{ width: 30%; margin-right: 2.5%; background: #fff; padding: 3% 4%; position: relative; transition: all 0.3s; box-shadow: 0px 6px 12px rgba(0,0,0,0.2); border-radius: 30px;}
.s_about .caption:first-child{ margin-left: 2.5%;}
.sab_ico{ position: absolute; top: -25px; left: 0; right: 0; margin: 0 auto; width: 80px; height: 80px; background: #119e96; text-align: center; border-radius: 50%;}
.sab_ico i{ display: inline-block; line-height: 80px; font-size: 50px; color: #fff;}
.s_about .caption h3{ font-size: 30px; color: #333; margin-bottom: 30px; margin-top: 25px; color: #119e96; font-weight: bold;}
.s_about .caption p{ line-height: 30px; font-size: 16px; color: #666;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;}

.s_product{ padding: 60px 0; padding-bottom: 50px;}
.s_biao{ position: relative; z-index: 2;}
.s_biao:after{ content: ''; width: 200px; height: 2px; background: #119e96; position: absolute; left: calc(50% + 120px); top: 50%; transform: translateY(-50%); z-index: -1;}
.s_biao:before{ content: ''; width: 200px; height: 2px; background: #119e96; position: absolute; right: calc(50% + 120px); top: 50%; transform: translateY(-50%); z-index: -1;}
.s_biao span{ font-size: 24px; background: #119e96; display: inline-block; padding: 4px 15px; background: #119e96; color: #fff; letter-spacing: 5px; font-weight: bold; position: relative;}
.s_biao span:after{ content: ''; width: 10px; height: 100%; position: absolute; left: calc(100% + 5px); top: 0; background: #119e96;}
.s_biao span:before{ content: ''; width: 10px; height: 100%; position: absolute; right:  calc(100% + 5px); top: 0; background: #119e96;}




.s_product .swiper2{ margin: 0 auto; padding: 50px 0; margin-top: 60px; background: #119e96;}
.lei_img{ padding-top: 55%; position: relative;}
.lei_img img{ position: absolute; height: 100%; max-width: 100%; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto;}
.lei_name{ margin-top: 30px; font-size: 16px; text-align: center; color: #333; transition: all 0.3s;}
.lei_name i{ display: inline-block; margin-right: 15px; font-size: 30px; vertical-align: middle;}
.s_product .swiper2 .swiper-slide:hover .lei_name{ color: #119e96;}
.s_product .swiper2 .swiper-slide a{ padding: 30px 0; display: block; background: #e8e6e5;}


.s_product2 .s_biao{ margin-bottom: 60px;}
.s_product2 .scp_list:nth-child(1) .swiper-container{ border: none;}
.scp_list{ margin: 0 10%; background: #119e96; position: relative;}
.scp_list:after{ content: ''; background: #dedede; position: absolute; width: 1px; height: 100%; left: 33.33%; top: 0;}
.scp_list:before{ content: ''; background: #dedede; position: absolute; width: 1px; height: 100%; left: 66.66%; top: 0;}
.scp_list .swiper-container{ border-top: 1px solid #dedede;}

.scp_list .swiper-slide a{ display: block; padding-top: 76%; margin: 10px; position: relative; transition: all 0.3s; background: url(../image/x22_2.jpg) center no-repeat; background-size: cover;}

.scp_list .swiper-slide:hover .scp_name span{ color: #119e96;}
.scp_list .swiper-slide:hover .scp_name span:after{ background: #119e96;}
.scp_img{ padding-top: 50%; position: absolute; width: 85%; left: 0; right: 0; margin: 0 auto; top: 8%;}
.scp_img img{ position: absolute; top: 50%;  transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; max-width: 100%; max-height: 100%;}
.scp_name{ position: absolute; bottom: 10%; left: 0; right: 0; margin: 0 auto; text-align: center;}
.scp_name span{ display: inline-block; font-size: 16px; color: #333; padding-top: 20px; position: relative;}
.scp_name span:after{ content: ''; width: 40px; height: 2px; background: #333; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto;}

.scp_list .swiper-button-next, .scp_list .swiper-button-prev{ width: 58px; height: 58px; border: 5px solid #fff; text-align: center; line-height: 48px; margin: 0; transform: translateY(-50%); border-radius: 50%; background: none;}
.scp_list .swiper-button-next i, .scp_list .swiper-button-prev i{ display: inline-block; line-height: 48px; font-size: 30px; color: #fff;}
.scp_list .swiper-button-next{ right: -100px;}
.scp_list .swiper-button-prev{ left: -100px;}

.s_why_us{display: flex; background: #fff; width: 100%;
    display: -webkit-flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;}
.why_img{ width: 50%;}
.why_text{ width: 50%; padding: 0 4%;}
.why_text h2{ margin: 0;}
.why_text h2 span strong{ color: #119e96;}
.why_text h2 span{ display: inline-block; padding-bottom: 15px; border-bottom: 3px solid #119e96;}
.why_text ul{display: flex;
    display: -webkit-flex;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: flex-start;}
.why_text ul li{ width: 48%; padding-left: 65px; position: relative; margin-top: 40px;}
.thy_ico{ position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.thy_ico:after{ content: ''; width: 1px; height: 170%; background: #119e96; position: absolute; right: -15px; top: 50%; transform: translateY(-50%); transition: all 0.3s;}
.thy_ico i{ font-size: 52px; display: inline-block; transition: all 0.3s; color: #119e96;}
.why_text ul li:nth-child(2n){ margin-left: 4%;}
.why_text ul li:nth-child(4) .thy_ico i{ transform: scale(1.15);}
.thy_content{ position: relative; padding-left: 18px;}
.thy_content h4{ color: #333; transition: all 0.3s; font-size: 24px;}
.thy_content p{ line-height: 30px; font-size: 16px; color: #666; margin: 0; display: -webkit-box;
    -webkit-box-orient: vertical; transition: all 0.3s;
    -webkit-line-clamp: 3;
    overflow: hidden}

.why_text ul li:hover .thy_ico i{ color: #119e96;}
.why_text ul li:hover .thy_content h4, .why_text ul li:hover .thy_content p{ color: #119e96;}
.why_text ul li:hover .thy_content:after{ background: #119e96;}

.footer>.container>.row .col-sm-3 .caption p{ position: relative; padding-left: 40px;}
.footer>.container>.row .col-sm-3 .caption p span{ position: absolute; left: 0; top: 0; display: inline-block;}
.footer .caption h4{ margin-bottom: 25px; font-weight: bold; color: #666;}
.footer .caption h5{ margin-top: 20px; color: #666;}
.footer .caption h5 a{ display: inline-block; margin-right: 10px;}
.footer .caption p{ line-height: 24px; color: #666;}
.footer .caption p a{ color: #666;}

.footer{ background: #fff; padding-top: 40px;}
.foot_di{ background: #119e96; color: #fff; padding: 10px 0; margin-top: 30px;}
.foot_di a{ color: #fff;}




@media (max-width:767px){



}
@media (min-width:768px) and (max-width:991px) {

}
@media (max-width:1200px) {
    .header{ height: 70px; position: static;}
    .header .container{ padding-right: 17%;}
    .logo{ height: 50px; top: 10px;}
    .pc_nav>ul>li{ margin-right: 10px;}
    .pc_nav>ul>li>a{ font-size: 14px; line-height: 70px; height: 70px;}
    .nav_more{ height: 70px; width: 64px;}
    .nav_lang{ left: -70px;}
    .nav_lang a{ font-size: 16px;}
    .nav_ss{ width: 64px; line-height: 70px; height: 70px;}
    .ss_right{ height: 70px;}
    .ss_right i{ line-height: 70px;}
    .nav_ss button{ height: 70px; width: 64px;}
    .nav_ss button i{ font-size: 24px; line-height: 70px;}
    .nav_ss input{ font-size: 14px;}
    .s_about, .s_product2{ padding: 60px 0;}
    .s_about .caption h3{ font-size: 18px; margin: 20px 0;}
    .s_about .caption p{ line-height: 24px; font-size: 14px;}
    .sab_ico{ width: 60px; height: 60px; line-height: 60px;}
    .sab_ico i{ line-height: 60px; font-size: 36px;}
    .scp_list .swiper-container .swiper-button-next, .scp_list .swiper-container .swiper-button-prev{ width: 36px; height: 36px; border: 2px solid #000; line-height: 32px;}
    .scp_list .swiper-container .swiper-button-next i, .scp_list .swiper-container .swiper-button-prev i{ line-height: 32px; font-size: 18px;}
    .why_text ul li{ margin-top: 15px; padding-left: 40px;}
    .thy_ico i{ font-size: 30px;}
    .why_text h2{ font-size: 20px;}
    .why_text h2 span{ padding-bottom: 10px;}
    .thy_content h4{ font-size: 16px;}
    .footer .caption h4{ font-size: 16px; margin-bottom: 15px;}
    .scp_list .swiper-button-next{ right: -80px;}
    .scp_list .swiper-button-prev{ left: -80px;}
    
    .s_biao:after, .s_biao:before{ width: 100px;}

}
@media (min-width:1201px) and (max-width:1650px) {
    .logo{ height: 60px; top: 12px;}
    .header .container{ padding-left: 21%;}
    .pc_nav>ul>li{ margin-right: 20px;}
    .pc_nav>ul>li>a{ font-size: 18px;}
    .nav_lang{ right: 100%;}
    .nav_more{ width: 130px;}
    .nav_ss{ width: 130px;}
    .nav_ss input{ font-size: 16px;}
    .nav_lang a{ font-size: 18px;}
    .nav_ss button i{ font-size: 30px;}
    .s_about{ padding: 60px 0;}
    .s_about .caption h3{ font-size: 18px; margin: 20px 0;}
    .s_about .caption p{ line-height: 24px; font-size: 14px;}
    .sab_ico{ width: 70px; height: 70px; line-height: 70px;}
    .sab_ico i{ line-height: 70px; font-size: 46px;}
    .thy_content h4{ font-size: 18px;}
    .thy_content p{ font-size: 14px; line-height: 24px;}
  
}

@media (min-width:1651px){
.footer .container{ width: 1400px;}
.ej_li a{ font-size: 16px;}
}