* {
    margin: 0px;
    padding: 0px;
}

body {
    font-family: "微软雅黑";
    background: #5e5e60;
}
@font-face {
    font-family: 'Avenir Next';
    src: url('../font/AvenirNext-Medium.woff2') format('woff2'),
        url('../font/AvenirNext-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Avenir Next';
    src: url('../font/AvenirNext-Regular.woff2') format('woff2'),
        url('../font/AvenirNext-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Avenir';
    src: url('../font/Avenir-Roman.woff2') format('woff2'),
        url('../font/Avenir-Roman.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Avenir';
    src: url('../font/Avenir-Black.woff2') format('woff2'),
        url('../font/Avenir-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

body,
div,
h1,
h2,
h3,
ul,
ol,
li,
p {
    margin: 0px;
    padding: 0px;
}

ul,
ol,
li {
    list-style: none;
}
img{margin: 0px; padding: 0px; float: left;}

.fl {
    float: left;
}

.fr {
    float: right;
}

.clearfix {
    *zoom: 1;
}

.clearboth{ clear:both; line-height:5px }
.clearfix:after {
    visibility: hidden;
    display: block;
    clear: both;
    height: 0px;
    content: "";
}
.main{
    width:1280px;
    margin: 0px auto;
    background: #ffffff;
}

.home_top{
    width: 1280px;
    height: 692px;
    margin: 0px auto;
    background: url(../images/home_banner1.png) no-repeat top center;

}
.home_nav{
    width: 1152px ;              
    margin: 0px auto 0px;
    border-bottom: 1px solid #fff;
    padding:40px 0px 20px 0px;
}
.home_nav .h_logo{
    float: left;
    height: 30px;
}
.home_nav .h_logo img{ height:30px; text-align:left; }

.home_nav .nav_box{
    float: right;
    text-align: right;
    margin-right: -28px;
}
.home_nav .nav_box a{
    display: inline-block;
    margin: 0px 12px;
    padding: 0px 18px;
    font-size: 12px;
    text-align: center;
    line-height: 32px;
    color: #ffffff;
    text-decoration: none;
    font-family:"Avenir Next" ;
    font-weight: normal;
}
.home_nav .nav_box a:hover,.home_nav .nav_box a.nav_xuan{
    background: #c7ae8b;
    border-radius: 18px;
    color: #ffffff;
}

.home_banner{ 
    width:1280px; 
    margin: 78px auto 38px;
    text-align: center;
}

.home_banner h1{
    text-align: center;
    font-size:80px ;
    line-height: 96px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
}
.home_banner h2{
    text-align: center;
    font-size:16px ;
    line-height: 36px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
}

.home_banner .nav_a{
    font-size: 16px;
    height: 60px;
    line-height: 60px;
    margin: 20px auto 0px;
    outline: none;
    cursor: pointer;
    text-align: center;
    background: #c7ae8b;
    color: #ffffff;
    text-align: center;
    display: inline-block;
    padding: 0px 36px;
    font-family:"Avenir Next" ;
    font-weight: normal;
}
.home_banner .nav_a a{
    display: inline-block;
    padding-right:26px;
    background: url(../images/next.svg) no-repeat right center;
    background-size: 16px;
    font-size: 16px;
    text-decoration: none;
    color: #ffffff;
}


.infor_box{
    margin: 0px auto;
    padding: 80px;
}

.infor_twobox{
    margin: 0px;
    padding: 0px;
}

.infor_twobox .home_left{
    width: 440px;
    float: left;
}
.infor_twobox .home_left h1{
    font-size: 54px;
    line-height: 50px;
    letter-spacing: 40;
    color: #adadad ;
    margin-bottom: 16px;
    text-transform: uppercase;
    font-family:"Avenir Next" ;
    font-weight: 500;
}
.infor_twobox .home_left h1 span{
    color: #000000;
}
.infor_twobox .home_left h2{
    font-size: 28px;
    line-height: 25px;
    letter-spacing: -25;
    color: #adadad ;
    margin-bottom: 16px;
    text-transform: uppercase;
    font-family:"Avenir Next" ;
    font-weight: 500;
}
.infor_twobox .home_left h3{
    font-size: 24px;
    line-height: 33px;
    color: #adadad ;
    margin-bottom: 16px;
    text-transform: uppercase;
    font-family:"Avenir" ;
    font-weight: 900;
}
.infor_twobox .home_left p{
    font-size: 19px;
    line-height: 22px;
    color: #000000 ;
    margin-bottom: 40px;
    font-family:"Avenir" ;
    font-weight: normal;
}
.infor_twobox .home_right{
    width: 572px;
    float: right;
}
.infor_twobox .home_right h1{
    font-size: 54px;
    line-height: 50px;
    letter-spacing: 40;
    color: #adadad ;
    margin-bottom: 16px;
    text-transform: uppercase;
    font-family:"Avenir Next" ;
    font-weight: 500;
}
.infor_twobox .home_right h1 span{
    color: #000000;
}
.infor_twobox .home_right p{
    font-size: 15px;
    line-height: 22px;
    color: #000000 ;
    margin-bottom: 20px;
    font-family:"Avenir" ;
    font-weight: normal;
    text-align: justify;

}
.infor_twobox .home_right img{
    width: 100%;
}

.infor_twobox .lianjie{ 
    text-align: left;
    margin-bottom: 80px;
 }
 .infor_twobox .lianjie img{ 
    text-align: left;
    height: 46px;
 }

.foot{ 
    background:#000000;
    padding: 100px 80px;
    text-align: center;
    line-height: 20px;
    color: #606060;
    font-size: 11px;
    font-family:"Avenir" ;
    font-weight: normal;

 }
 .foot .imglogo{
    width: 96px;
    float: left;
 }
 .foot span{
    display: inline-block;
    float: right;
    line-height: 20px;
    color: #606060;
    font-size: 11px;
 }
 .foot span.bai{
    color: #ffffff;
 }



.about_box{ 
    width: 1120px;
    margin: 0px auto;
    padding: 40px 80px 0px 80px;
    background: #ffffff;
 }
.about_top{             
    border-bottom: 1px solid #000000;
    padding:0px 0px 20px 0px;
    margin-bottom: 24px;
}
.about_top .about_logo{
    float: left;
    height: 30px;
}
.about_top .about_logo img{ height:30px; text-align:left; }

.about_top .about_nav{
    float: right;
    text-align: right;
    margin-right: -28px;
}
.about_top .about_nav a{
    display: inline-block;
    margin: 0px 12px;
    padding: 0px 18px;
    font-size: 12px;
    text-align: center;
    line-height: 32px;
    color: #000000;
    text-decoration: none;
    font-family:"Avenir Next" ;
    font-weight: normal;
}
.about_top .about_nav a:hover,.about_top .about_nav a.nav_xuan{
    background: #c7ae8b;
    border-radius: 18px;
    color: #ffffff;
}

.about_banner{
    width: 100%;
    height: 354px;
    display: block;
}
.about_banner img{
    width: 100%;
    height: auto;
    display: block;
}

.about_infor{
    padding-top: 128px;

}
.about_infor h1{ 
    font-size: 54px;
    line-height: 54px;
    letter-spacing: 40;
    margin-bottom: 24px;
    color: #000000;
    text-transform: uppercase;
    font-family:"Avenir Next" ;
    font-weight: 500;
 }
.about_infor h1 span{
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-left: 24px;
}
.about_infor h2{
    font-size: 46px;
    line-height: 50px;
    letter-spacing: -20;
    color: #adadad ;
    margin-bottom: 20px;
    text-transform: uppercase;
    font-family:"Avenir Next" ;
    font-weight: 500;
}

.about_infor p{
    font-size: 19px;
    line-height: 22px;
    color: #000000 ;
    margin-bottom: 24px;
    font-family:"Avenir" ;
    font-weight:normal;
    text-align: justify;
}



.about_infor p.imgbox { margin:18px 0px; padding:0px;  display:inline-block; }

.about_infor p.imgbox img { margin:0px; padding:0px; display:inline-block; }




.busin_box{ 
  width: 1120px;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  margin-bottom: 200px;
  padding-top: 40px;
  font-family:"Avenir Next" ;
    font-weight: normal;
 }
.busin_box .bus_list{
    width: 198px;
    margin-right: 26px;
    float: left;
    display: flex;
    flex-direction: column;
    font-family:"Avenir Next" ;
    font-weight: normal;
}

.busin_box .bus_list img{
    width: 100%;
    height: 160px;
}
.busin_box .bus_list p{
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -10;
    padding: 20px 0px 36px 0px;
    color: #000;
    text-align: center;
    font-family:"Avenir Next" ;
    font-weight: normal;
}



.busin_box .refer_list{
    width: 324px;
    float: left;
    display: flex;
    flex-direction: column;
    margin-right: 48px;
}

.busin_box .refer_list img{

}
.busin_box .refer_list p{
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -10;
    padding: 20px 0px 36px 0px;
    color: #000;
    text-align: center;
}



.mapbox{
    margin: 150px auto 100px;

}
.mapbox h1{
    font-size: 29px;
    line-height: 39px;
    color: #000000;
    text-align: left;
    font-family:"Avenir Next" ;
    font-weight: normal;
}
.mapbox .map_left{
    width: 210px;
    float: left;
}
.mapbox .map_left h2{
    font-size: 22px;
    line-height: 39px;
    color: #000000;
    text-align: left;
    font-family:"Avenir Next" ;
    font-weight: normal;
    padding: 10px 0px;
}

.mapbox .map_left ul{
    margin: 0px;
    padding: 0px;
}
.mapbox .map_left ul li{
   line-height: 54px;
   background: url(../images/qi.png) no-repeat left 16px;
   background-size: 24px;
   padding-left: 32px;
   font-size: 22px;
   text-align: left;
    font-family:"Avenir Next" ;
    font-weight: normal;
    color: #000000;
    text-decoration: none;
    cursor:pointer;
}
.mapbox .map_left ul li.active{
    color: #346aa4;
    font-weight: bold;
}
.mapbox .map_img{
    width: 888px;
    height: 500px;
    float: right;
    background: url(../images/map_hui.svg) no-repeat center center;
    position: relative;
}
.mapbox .map_img02{
    width: 888px;
    height: 500px;
    float: right;
    background: url(../images/map_liang.svg) no-repeat center center;
    position: relative;
}

.mapbox .map_img .map_c{
     width: 148px;
     height: 106px;
     position: absolute;
     left: 598px;
     top: 164px;
     transition: all 0.5s ease;
            opacity: 0;
            /*transform: scale(0.8);*/



}
.mapbox .map_img .map_c img{ width:100%; height:100% }
.mapbox .map_img .map_c.active {
            opacity: 1;
            /*transform: translate(-50%, -50%) scale(1);*/
        }
.mapbox .map_img .map_ruussia{
     width: 421px;
     height: 168px;
     position: absolute;
     right: 0px;

     top: 36px;
     transition: all 0.5s ease;
            opacity: 0;
            /*transform: scale(0.8);*/


}
.mapbox .map_img .map_ruussia img{ width:100%; height:100% }
.mapbox .map_img .map_ruussia.active {
            opacity: 1;
            /*transform: translate(-50%, -50%) scale(1);*/
        }
.mapbox .map_img .map_img03{
     width: 25px;
     height: 25px;
     position: absolute;
     right: 355px;
     top: 212px;
     transition: all 0.5s ease;
            opacity: 0;
            /*transform: scale(0.8);*/


}
.mapbox .map_img .map_img03 img{ width:100%; height:100% }
.mapbox .map_img .map_img03.active {
            opacity: 1;
            /*transform: translate(-50%, -50%) scale(1);*/
        }

.mapbox .map_img .map_img04{
     width: 27px;
     height: 28px;
     position: absolute;
     right: 385px;
     top: 232px;
     transition: all 0.5s ease;
            opacity: 0;
            /*transform: scale(0.8);*/


}
.mapbox .map_img .map_img04 img{ width:100%; height:100% }
.mapbox .map_img .map_img04.active {
            opacity: 1;
            /*transform: translate(-50%, -50%) scale(1);*/
        }
.mapbox .map_img .map_img05{
     width: 81px;
     height: 35px;
     position: absolute;
     right: 126px;
     top: 302px;
    transition: all 0.5s ease;
            opacity: 0;


}
.mapbox .map_img .map_img05 img{ width:100%; height:100% }
.mapbox .map_img .map_img05.active {
            opacity: 1;
        }

.mapbox .map_img .map_img06{
     width: 75px;
     height: 42px;
     position: absolute;
     right: 162px;
     top: 304px;
     transition: all 0.5s ease;
            opacity: 0;


}
.mapbox .map_img .map_img06 img{ width:100%; height:100% }

.mapbox .map_img .map_img06.active {
            opacity: 1;
        }









/*products*/
.pro_box{
    width: 1120px;
    padding-bottom: 200px;
  padding-top: 40px;
}

.pro_box .pro_left{
    width: 335px;
    float: left;
    font-family:"Avenir Next" ;
    font-weight: normal;
}

.pro_box .pro_left ul{
    margin: 0px;
    padding: 0px;

}
.pro_box .pro_left ul li{
    text-align: left;
    font-size: 22px;
    line-height:56px ;
    letter-spacing: -20;
    margin: 0px;
    padding: 0px;
}

.pro_box .pro_left ul li a{
    display: inline-block;
    text-align: left;
    font-size: 22px;
    line-height:56px ;
    letter-spacing: -20;
    font-weight: 400;
    text-decoration: none;
    color: #000000;
    font-family:"Avenir Next" ;
    font-weight: normal;

}
.pro_box .pro_left ul li a:hover, .pro_box .pro_left ul li a.pro_nav{
    color: #000000;
    font-weight: 800;
    text-decoration: none;
}


.pro_right{
    width: 775px;
    float: right;
}
.pro_right .produ{
    width: 100%;
}

.pro_right .produ .ducts{
    padding: 10px 0px;
    display: flex;
    /* 设置主轴方向 */
    flex-direction:row;
    /* 设置项目在容器中如果一行展示不完 是否要换行 */
    flex-wrap:wrap ;
    /* 设置项目对齐方式 */
    justify-content:center;


}
.pro_right .produ .ducts .flex_container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 104px;
  height: 96px;
  overflow: hidden;
  margin: 10px 10px;
}
.pro_right .produ .ducts .flex_container img {
  flex-shrink: 0;
  min-width: 100%;
  min-height: 100%;
}
.pro_right .produ p{
    width: 100%;

    height: 48px;
    line-height: 48px;
    text-align: center;
    background: #196aa9;
    font-size: 20px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
}




.pro_right .produ_class{
    width: 60%;
    padding-right: 40%;
}

.pro_right .produ_class .ducts{
    padding: 5px 0px;
    display: flex;
    /* 设置主轴方向 */
    flex-direction:row;
    /* 设置项目在容器中如果一行展示不完 是否要换行 */
    flex-wrap:wrap ;
    /* 设置项目对齐方式 */
    justify-content:center;


}
.pro_right .produ_class .ducts .flex_container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 31%;
  height: 120px;
  overflow: hidden;
  margin: 0px 5px;
}
.pro_right .produ_class .ducts .flex_container img {
  flex-shrink: 0;
  min-width: 100%;
  min-height: 100%;
}
.pro_right .produ_class p{
    width: 100%;

    height: 48px;
    line-height: 48px;
    text-align: center;
    background: #00b6f0;
    font-size: 20px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
    margin-bottom: 0px;
}

.pro_right .produ_class01{
    width: 60%;
    padding-left: 40%;
}

.pro_right .produ_class01 .ducts{
    padding: 10px 0px;
    display: flex;
    /* 设置主轴方向 */
    flex-direction:row;
    /* 设置项目在容器中如果一行展示不完 是否要换行 */
    flex-wrap:wrap ;
    /* 设置项目对齐方式 */
    justify-content:center;


}
.pro_right .produ_class01 .ducts .flex_container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 31%;
  height: 120px;
  overflow: hidden;
  margin: 0px 5px;
}
.pro_right .produ_class01 .ducts .flex_container img {
  flex-shrink: 0;
  min-width: 100%;
  min-height: 100%;
}
.pro_right .produ_class01 p{
    width: 100%;
    height: 48px;
    line-height: 48px;
    text-align: center;
    background: #196aa9;
    font-size: 20px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
    margin-bottom: 0px;
}

.pro_right .produ_class02{
    width: 50%;
}

.pro_right .produ_class02 .ducts{

    padding: 5px 0px 0px 0px;
    display: flex;
    /* 设置主轴方向 */
    flex-direction:row;
    /* 设置项目在容器中如果一行展示不完 是否要换行 */
    flex-wrap:wrap ;
    /* 设置项目对齐方式 */
    justify-content:space-around;


}
.pro_right .produ_class02 .ducts .flex_container {
  display: flex;
  flex-direction: column;
  width: 31%;
  overflow: hidden;
  margin: 0px 5px 0px 0px ;
}
.pro_right .produ_class02 .ducts .flex_container img {
  flex-shrink: 0;
  width: 100%;
  min-width: 100%;
  height: 120px;
}
.pro_right .produ_class02 .ducts .flex_container span{
    display: block;
    text-align: center;
    font-size: 18px;
    line-height: 22px;
    font-family:"Avenir Next" ;
    font-weight: normal;
    color: #000000;
}
.pro_right .produ_class02 p{
    width: 100%;
    height: 48px;
    line-height: 48px;
    text-align: center;
    background: #00b6f0;
    font-size: 20px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
    margin-bottom: 0px;
}



/*产品PRODUCTS03*/
.pro_right .produ_class03{
    width: 60%;
    margin-right: 40%;
    margin-bottom: 20px;
}

.pro_right .produ_class03 .ducts{
    width: 50%;
    float: right;
    padding: 0px 0px 0px 0px;
    display: flex;
    /* 设置主轴方向 */
    flex-direction:row;
    /* 设置项目在容器中如果一行展示不完 是否要换行 */
    flex-wrap:wrap ;
    /* 设置项目对齐方式 */
    justify-content:space-around;


}
.pro_right .produ_class03 .ducts .flex_container {
  display: flex;
  flex-direction: column;
  width: 50%;
  height: 50%;
  overflow: hidden;
  margin: 0px 0px 0px 0px ;
}
.pro_right .produ_class03 .ducts .flex_container img {
  flex-shrink: 0;
  width: 100%;
  min-width: 100%;
  height: 100%
}
.pro_right .produ_class03 .ducts .flex_container span{
    display: block;
    text-align: center;
    font-size: 18px;
    line-height: 22px;
    font-family:"Avenir Next" ;
    font-weight: normal;
    color: #000000;
}
.pro_right .produ_class03 p{
    width: 50%;
    padding: 100px 0px;
    float: left;
    height: 48px;
    line-height: 48px;
    text-align: center;
    background: #00b6f0;
    font-size: 20px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
    margin-bottom: 0px;
}


.pro_right .produ_class04{
    width: 60%;
    margin-left: 40%;
    margin-bottom: 20px;
}

.pro_right .produ_class04 .ducts{
    width: 50%;
    float: right;
    padding: 0px 0px 0px 0px;
    display: flex;
    /* 设置主轴方向 */
    flex-direction:row;
    /* 设置项目在容器中如果一行展示不完 是否要换行 */
    flex-wrap:wrap ;
    /* 设置项目对齐方式 */
    justify-content:space-around;


}
.pro_right .produ_class04 .ducts .flex_container {
  display: flex;
  flex-direction: column;
  width: 50%;
  overflow: hidden;
  margin: 0px 0px 0px 0px ;
}
.pro_right .produ_class04 .ducts .flex_container img {
  flex-shrink: 0;
  width: 100%;
  min-width: 100%;
  height: 120px;
}
.pro_right .produ_class04 .ducts .flex_container span{
    display: block;
    text-align: center;
    font-size: 18px;
    line-height: 22px;
    font-family:"Avenir Next" ;
    font-weight: normal;
    color: #000000;
}
.pro_right .produ_class04 p{
    width: 50%;
    padding: 100px 0px;
    float: left;
    height: 48px;
    line-height: 48px;
    text-align: center;
    background: #00b6f0;
    font-size: 20px;
    color: #ffffff;
    font-family:"Avenir Next" ;
    font-weight: normal;
    margin-bottom: 0px;
}

/*products*/
.pro_right .produ_class05{ width:80%; margin:0 auto; }
.pro_right .produ_class05 img{ width:100%; }


.pro_right .images_box{ width:100% }

.pro_right .images_box img{ width:100%; }

.pro_right .images_newbox{ width:661px; margin-left:114px; }

.pro_right .images_newbox img{ width:100%; margin-bottom: 6px;}

/* 放大效果样式 */
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.92);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1000;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.3s ease;
        }
        
        .overlay.active {
            opacity: 1;
            pointer-events: all;
        }
        
        .overlay-content {
            position: relative;
            max-width: 90%;
            max-height: 90%;
        }
        
        .overlay-content img {
            max-width: 100%;
            max-height: 80vh;
            display: flex;
            flex-direction: column;
            border-radius: 8px;
            box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
        }
        
        .close-btn {
            position: absolute;
            top: -48px;
            right: -20px;
            color: white;
            font-size: 40px;
            cursor: pointer;
            transition: transform 0.3s ease;
        }
        
        .close-btn:hover {
            transform: rotate(90deg);
            color: #ff7e5f;
        }
        
        .image-info {
            color: white;
            text-align: center;
            margin-top: 15px;
            font-size: 1.2rem;
            line-height: 32px;
            display: block;
        }
        
        .instructions {
            text-align: center;
            margin-top: 40px;
            padding: 15px;
            background: rgba(255, 255, 255, 0.1);
            border-radius: 10px;
            max-width: 600px;
            margin: 40px auto 0;
            font-size: 1.1rem;
        }
        
        .instructions i {
            color: #ff7e5f;
            margin-right: 8px;
        }