/*
+----------------------------------------------------------------------
| LN-EWS v2.0 [ Do a line, love a line ]
| Copyright (c) 2010~2024 http://jzline.com All rights reserved.
| Author: xwxc
+----------------------------------------------------------------------
*/


.agent_bg{height:auto;width:100%;overflow:hidden;background:url(/static/tn106/index_bg/11.png);background-origin:100% 100%;background-color:#f5f5f5;background-attachment:fixed;position:relative;}

.agent_bg:before{background:rgba(0,0,0,0.8);content:"";height:100%;left:0;opacity:0.6;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";position:absolute;top:0;width:100%}


.agent{margin:100px 0px 0px 0px;color:#fff;position:relative;color:#333;height:auto}
.agent .tit_box{height:auto}
.agent .tit{margin:0px 0px 0px 0px;height:58px}
.agent .tit h2{ color: #fff;font-size: 40px;font-weight: bold;font-family: arial}
.agent .tit h3{color:#222;font-size:40px;padding-top:10px}
.agent .tit_desc{font-size:18px;padding-top:10px;line-height:1.8;color:#999;text-align:right}


.agent .line {text-align: left;}
.agent .line span{display:inline-block;margin:0 2px 0 0;height:2px;border-radius:2px;margin-top:14px;text-align: center;}
.agent .line span:nth-child(1){width:2px;background:#85ac96;animation:w0_to_w50 1.5s linear infinite alternate}
.agent .line span:nth-child(2){width:50px;background:#188a49;animation:w50_to_w0 1.5s linear infinite alternate}


.agent .type{height:60px;text-align: right;}
.agent .type .pro_type_name{width:auto;height:40px;padding:5px 15px;text-align:center;display:inline-block;margin-right:10px;border-radius:10px 0 10px 0;border:1px solid #188a49;}
.agent .type .pro_type_name a{color:#333;font-size:19px;text-align:center;line-height:40px;height:40px;}
.agent .type .pro_type_name:hover{border:1px solid #188a49;background-color:#188a49;}
.agent .type .pro_type_name:hover a{color:#FFF;}
.agent .type .at{border:1px solid #188a49;background-color:#188a49;}
.agent .type .at a{color:#FFF;}



.agent2{margin:10px 0px 0px 0px;color:#fff;position:relative;color:#333;height:auto}
.agent2 .list {height:auto; padding:50px 0px 100px 0px }




.agent2 .list .item{height:auto;text-align:center;margin:0px 0px 0px 0px;position:relative;overflow:hidden;  color: #fff;


}
.agent2 .list .item_box{border: 1px solid #eee;height: 400px;padding-top: 100px; padding-left: 30px;padding-right: 30px;
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;
border-radius:10px;

position:relative;
}




.agent2 .list .item .icon {text-align:center;width:100px;height:100px;margin:0 auto;border-radius:50%; border:1px solid #fff; -moz-transition:all 1s;transition:all 1s;-ms-transition:all 1s;margin-top: 80px;

/*-webkit-animation: jzline_Move3 2s infinite 2s alternate;
animation: jzline_Move3 2s infinite 2s alternate*/
}

.agent2 .list .item .icon  img{width: 50px;height: 50px;margin-top: 25px}

.agent2 .list .item .name {font-size: 24px;font-weight: bold;height: 50px;line-height: 80px;}
.agent2 .list .item .name2 {font-size: 24px;font-weight: bold;height: 50px;line-height: 50px;display: none;
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;}
.agent2 .list .item .desc {font-size: 16px;font-weight: bold;height: 50px;line-height: 25px;display: none;-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;}

.agent2 .list .item:hover .item_box{padding-top: 0px;height: 500px;
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;
}


.agent2 .list .item:hover .icon  {	
 border:1px solid #188a49;
   background-color: #188a49; /* 你想要叠加的颜色 */
  background-blend-mode: multiply;
}

.agent2 .list .item:hover .icon  img{
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;
transform:rotate(360deg);
}

.agent2 .list .item:hover .name{display: none;
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;}

.agent2 .list .item:hover .name2{display: block;
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;}

.agent2 .list .item:hover .desc{display: block;
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;}

.agent2 .list .item:hover .item_box{
background-color: #188a49;
border-radius:50px;
	
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 1s ;
-ms-transition:all 1s;
border:2px dashed #fff;
}

.rotating-ring{position:absolute;width:110px;height:110px;border:3px dashed #fff;border-radius:50%;top:231px;left:50%;transform:translate(-50%,-50%);animation:rotate 5s linear infinite;z-index:1;



-webkit-transition:all 3s;
-moz-transition:all 3s;
transition:all 3s ;
-ms-transition:all 3s;

}




.agent2 .list .item:hover .rotating-ring{
	
  width: 100px;       /* 调整宽度（直线长度） */
  height: 3;          /* 高度设为0，变成水平线 */
  border-radius: 0;   /* 移除圆角 */
  border: 2px dashed #fff; /* 实线（可根据需求调整粗细） */
  border-left: none;  /* 移除左右边框（可选） */
  border-right: none;
  animation: none;    /* 停止旋转动画 */
  transform: translate(-50%, -50%); /* 保持居中 */
  
  margin-top: 10px;
-webkit-transition:all .3s;
-moz-transition:all 1s;
transition:all 2s ;
-ms-transition:all 1s;

}


@keyframes rotate{
0%{transform:translate(-50%,-50%) rotate(0deg)}
100%{transform:translate(-50%,-50%) rotate(360deg)}
}







@-webkit-keyframes jzline_Move3 {
    from {        
      margin-top: 70px;   
    
    }
    to {         
       margin-top: 80px;
      
    }
}
@keyframes jzline_Move3 {
    from {        
       margin-top: 70px;   
     
    }
    to {         
       margin-top: 80px;
       
    }
}










@media(max-width:992px){
	
}















@media only screen and (max-width:768px){.agent{margin:50px 0px 50px 0px}
.agent .item .pic img{height:160px}
}@media only screen and (max-width:1300px){.agent .tit img{width:300px}
}