@charset "utf-8";
	/* CSS Document */
/* common */
/**html {
	-webkit-filter:grayscale(100%);
	-moz-filter:grayscale(100%);
	-ms-filter:grayscale(100%);
	-o-filter:grayscale(100%);
	filter:grayscale(100%);
	filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}
**/
ul:after{
    content: "";
    display: block;
    clear: both;
}


/*banner*/
.banner{position:relative;overflow: hidden;zoom:1;margin-top:4px;width:100%;margin:0 auto;z-index:99}





.swiper-container {
      width: 100%;
      height: 100%;
    }

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }



.slogan {background:#fff}
.slogan .dl{/* margin-top:20px; */background: #fff;overflow: hidden;zoom:1}
.slogan .dl dl{float: left;overflow: hidden;zoom:1;width:282px;/* -webkit-box-shadow: 0 0 10px rgba(153,153, 153, .5); -moz-box-shadow: 0 0 10px rgba(153, 153, 153, .5); box-shadow: 0 0 10px rgba(153, 153, 153, .5); */margin:10px;padding:0px 15px;background: #fff;box-sizing: border-box;}
.slogan .dl dl:nth-child(4){margin-right:0px;}
.slogan .dl dl dt{float: left;width:60px;background: url(../images/lbg.png) no-repeat center center;line-height:60px;text-align:center;font-size:28px;font-weight: bold;color:#12336d}
.slogan .dl dl dd{float: left;margin: 8px 0px 0px 8px;}
.slogan .dl dl dd p{color: #12336d;}
.slogan .dl dl dd p.p1{color:#666}






.ind_txt{ width: 100%; text-align: center; display: block; position: relative; font-size: 22px;color: #333;font-weight: bold;  }
.ind_txt span{ width: 100%; display: block; position: relative; overflow: hidden; font-size: 18px; padding-top: 10px; }

.ind_one_ls{padding:20px;background:#fff;}
.ind_one_ls:after{
    content: "";
    display: block;
    clear: both;
}
.ind_one_ls dl{ width: 25%;float: left;display: block; position: relative; padding-right: 10px;/*  transition: all .9s ease; */box-sizing: border-box;}
.ind_one_ls dl:nth-child(4){padding:0;}
.ind_one_ls dl:hover{box-shadow: 0 0 4px rgba(0, 0, 0, .2); }
.ind_one_ls dl dt{ width:100%;display: block; overflow: hidden; position: relative; }
.ind_one_ls dl dt .img{ width: calc(100% + 20px); backface-visibility: hidden; height:220px; display: block;
 -webkit-transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,transform .35s;
    transition: opacity .35s,transform .35s,-webkit-transform .35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden; 
   }
.ind_one_ls dl dd{ width: 100%; padding:10px 10px 0px 10px; box-sizing: border-box; display: block; position: relative; overflow: hidden; }
.ind_one_ls dl dd h2{ font-size: 18px;color: #444242; height: 25px; overflow: hidden; line-height: 25px; position: relative; display: block; }
.ind_one_ls dl dd p{ font-size: 14px; line-height: 20px;overflow: hidden; position: relative; display: block;color: #8e8e8e; }


.ind_one_ls dl:hover dt .img{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} 









.ind_one_ls2{padding:20px;background:#fff;}
.ind_one_ls2:after{
    content: "";
    display: block;
    clear: both;
}
.ind_one_ls2 ul{}
.ind_one_ls2 ul li{ width: 278px;float: left;display: block; position: relative; margin-right: 15px;/*  transition: all .9s ease; */box-sizing: border-box;}
.ind_one_ls2 ul li:nth-child(4){margin:0;}
.ind_one_ls2 ul li:hover{box-shadow: 0 0 4px rgba(0, 0, 0, .2); }
.ind_one_ls2 ul li a{display:block;width:100%;display: block; overflow: hidden; position: relative; }
.ind_one_ls2 ul li a .img{ width: calc(100% + 20px); backface-visibility: hidden; height:220px; display: block;
 -webkit-transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,transform .35s;
    transition: opacity .35s,transform .35s,-webkit-transform .35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden; 
   }
.ind_one_ls2 ul li a .itit{position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;padding:30px;box-sizing: border-box;     background: rgb(132 177 255 / 20%);}
.ind_one_ls2 ul li a .itit h2{width: 100%;font-weight: bold;font-size: 18px;color: #12336d; height: 25px; overflow: hidden; line-height: 25px; position: relative; display: block; }
.ind_one_ls2 ul li a .itit i{ display: block;
    width: 80%;height:45px;
    font-size: 12px;
    color: #12336d;
    line-height: 14px;
    font-style: normal;
    margin: 8px 0px;}
.ind_one_ls2 ul li a .itit p{width:75%;font-size: 14px; line-height: 20px;overflow: hidden; position: relative; display: block;color: #ff5500; }
.ind_one_ls2 ul li a .itit span{    position: absolute;
    bottom: 30px;font-size: 12px;
    padding: 5px 20px;
    background: #12336d;
    border-radius: 4px;
    color: #fff;
}


.ind_one_ls2 ul li a:hover .img{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} 
.ind_one_ls2 ul li a:hover .itit{background: rgb(0 0 0 / 20%);} 
.ind_one_ls2 ul li a:hover .itit span{background: #575757;} 
 .ind_one_ls2 ul li a:hover .itit h2,.ind_one_ls2 ul li a:hover .itit p,.ind_one_ls2 ul li a:hover .itit i{color: #fff;} 
 .ind_one_ls2 ul li a:hover .itit h2{text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3);} 






























.ind_moe{ width: 100%;text-align: center;display: block; }
.ind_moe ul{ text-align: center; }
.ind_moe ul li{ display: inline-block; }
.ind_moe ul li a{width: 135px; border-radius: 20px; height: 35px; font-size: 16px; line-height: 35px; border: 1px solid #12336d; background: #12336d; color: #fff; display: block; }
.ind_moe ul li a:hover,.ind_moe ul li a.nav{ border: 1px solid #202020; background: #fff; color: #202020; }


.probox{overflow:hidden;}

.ind_two_as,.ind_two_as2{width: 590px;padding: 20px;display: block;background: #fff;box-sizing: border-box;overflow: hidden;}
.ind_two_astxt{ width: 100%;padding: 0 0 0 10px; box-sizing: border-box; display: block; position: relative; overflow: hidden;  line-height: 60px; height: 60px;font-size: 22px; color: #000; z-index: 22; }
.ind_two_astxt:before{ width: 150px; height: 3px; background: #12336d; display: block; left: 0; top: 57px; position: absolute; z-index: 333;content: ""; }
.ind_two_astxt:after{ width: 100%; height: 3px; background: #d0d0d0; display: block; left: 0; top: 57px; position: absolute; z-index: 33;content: ""; }


#menu1{overflow:hidden}
.menu1box:after{ width: 100%; height: 1px; background: #d0d0d0; display: block; left: 0; top: 39px; position: absolute; z-index: -2;content: ""; }
.menu1box{ width: 100%; float: left;  display: block; position: relative;  z-index: 22;  overflow: hidden; }
.menu1box ul li { display:block; float: left; box-sizing: border-box; line-height: 40px; height: 40px;font-size: 16px; color: #000;  padding: 0 10px; cursor: pointer;border-bottom: 1px solid #d0d0d0;}  
.menu1box ul li.hover {border-bottom: 2px solid #12336d;}  
.menu1box ul li.hover a{font-weight:bold;color: #12336d;}  
.menu1box ul li a{color:#000}
#main1 ul,#main2 ul {display: none;}
#main1 ul.block,#main2 ul.block {display: none;} 



.ind_two_ascon,.ind_two_ascon2{ width: 100%; box-sizing: border-box; padding:20px 10px; display: block; position: relative; overflow: hidden; }
.ind_two_ascon dl,.ind_two_ascon2 dl{ width: 100%; display: block; float: left; position: relative; font-size: 14px; color: #636363;height: 40px; line-height: 40px;  overflow: hidden;box-sizing: border-box; }

.ind_two_ascon dl dt,.ind_two_ascon2 dl dt{ width: 80%; float: left; overflow: hidden;text-overflow: ellipsis;white-space: nowrap; position: relative; display: block; color:#000;}
.ind_two_ascon dl dt:hover,.ind_two_ascon2 dl dt:hover{text-decoration:underline;}
.ind_two_ascon dl dd,.ind_two_ascon2 dl dd{ width: 20%; float: right; overflow: hidden; position: relative; display: block; text-align: right; color:#000;}

.ind_two_ascon dl:nth-child(1),.ind_two_ascon dl:nth-child(2),.ind_two_ascon dl:nth-child(3),.ind_two_ascon2 dl:nth-child(1),.ind_two_ascon2 dl:nth-child(2),.ind_two_ascon2 dl:nth-child(3){background-image: url(../images/ind_icon_06.png); background-repeat: no-repeat; background-position:  left center; background-size: 28px; padding-left: 35px; }



.ind_two_asdown{width: 100%; padding:30px 10px; box-sizing: border-box; display: block; position: relative; overflow: hidden;}
.ind_two_asdown dl{ width: 277px; margin-right: 15px; box-sizing: border-box; padding:27px 20px; display: block; float: left; border: 1px solid #efefef; margin-bottom: 15px; }
.ind_two_asdown dl dt{ width: 28%; float: left; }
.ind_two_asdown dl dt img{ max-width: 100%; }
.ind_two_asdown dl dd{ width: 70%; float: right; font-size: 16px; padding-top: 5px; color: #202020; line-height: 100%; display: block; text-align: center;}
.ind_two_asdown dl:nth-child(even){ margin-right: 0; }


.in_new{padding:0px 15px 10px 15px;background:#fff;}
.ul-list3y{line-height:60px;margin-bottom:20px;border-bottom: 1px solid #eeeeee;}
.ul-list3y li{display: inline-block;}
.ul-list3y a{display: block;padding: 0 30px;position: relative;color: #333;font-size: 16px;}
.ul-list3y a:after{position: absolute;right: 0;top: 50%;margin-top: -13px;height: 26px;width: 1px;background: #dfdfdf;content: '';}
.ul-list3y li:last-child a:after{display: none;}
.ul-list3y .on a, .ul-list3 a:hover{color: #12336d;font-weight:bold}


.jz_list{background:#fff;padding: 15px;}

.ul-list4y{}
.ul-list4y li{width:20%;float: left;padding:5px; border: 1px solid transparent;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
}

.ul-list4y .con{display: block;position: relative;overflow: hidden;font-size: 16px;}
.ul-list4y .con .imgb{position:relative;display: block;width:100%;height:164px;overflow:hidden;} 
.ul-list4y .con .imgb .co1{background:#035089;}
.ul-list4y .con .imgb .co2{background:#108903;}
.ul-list4y .con .imgb .co3{background:#896703;}
.ul-list4y .con .imgb .co4{background:#0860e7;}
.ul-list4y .con .imgb .co5{background:#031989;}
.ul-list4y .con .imgb .co6{background:#710014;}
.ul-list4y .con .imgb .co7{background:#000000;}
.ul-list4y .con .imgb .co8{background:#0098a9;}
.ul-list4y .con .imgb .co9{background:#004c6b;}
.ul-list4y .con .imgb .co10{background:#d57800;}
.ul-list4y .con .imgb .co1,.ul-list4y .con .imgb .co2,.ul-list4y .con .imgb .co3,.ul-list4y .con .imgb .co4,.ul-list4y .con .imgb .co5,.ul-list4y .con .imgb .co6,.ul-list4y .con .imgb .co7,.ul-list4y .con .imgb .co8,.ul-list4y .con .imgb .co9,.ul-list4y .con .imgb .co10{
	/* opacity:0.2; */
}
.ul-list4y .con .imgb .imgtxt{position:absolute;padding:20px;width:100%;height:100%;z-index:9;color:#fff;text-align:center;box-sizing: border-box;}
.ul-list4y .con .imgb  .cobg{opacity:0.4;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;}
.ul-list4y .con .imgb .imgtxt p{
	display:inline-block;
    width: 185px;
    height: 70px;
	line-height:110px;
	overflow:hidden;
    vertical-align: middle;
    font-size: 22px;text-align:center;text-shadow: 2px 2px 2px rgb(0 0 0 / 50%);z-index:2;}
.ul-list4y .con .imgb .imgtxt span{
	display: inline-block;
    text-align: center;
    font-size: 16px;
	color: #ffffffe3;
	/* border: 1px #fff solid;
    border-radius: 4px;
    padding: 0px 4px;
    border-color: #ffffff6b;
    border-radius: 4px; */
    height: 24px;
    line-height: 24px;
    overflow: hidden;
}
.ul-list4y .con .img{display: block;width:100%;height:164px;transition:.3s;} 
.ul-list4y li:hover{border: 1px solid #eeeeee;box-shadow: 0px 10px 15px 0px rgba(104, 111, 122, 0.15);}
.ul-list4y li:hover .img{
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
 }

.ul-list4y .txt{font-size:14px;height: 40px;line-height: 20px;padding: 10px 10px 5px 10px;
    -o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
}
.ul-list4y .txt span{color:#000;height: 40px;overflow:hidden;
text-overflow: ellipsis;
display:-webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient:vertical;
-moz-box-orient:vertical;
word-break: break-all;}
.ul-list4y .txt3{height:48px;padding: 10px 10px 10px 60px;line-height: 24px;background: rgba(0,0,0,.5);position: absolute;bottom: 0;left: 0;right: 0;}
.ul-list4y .txt3 p{height: 48px;overflow-y: hidden;}
.ul-list4y .txt3 i{display: block;width: 40px;height: 40px;position: absolute;background: url(../images/img24.png) no-repeat center center;left: 10px;top: 14px;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}


.ul-list4y .txt2{
    position: absolute;left: 0;top: 0;right: 0;bottom: 0;
    background-color: #4c5053;
    background-position: center center;
    background-repeat: no-repeat;
    line-height: 22px;font-size: 14px;padding: 0 30px;
    text-shadow: 3px 3px 5px rgba(0, 0, 0, .75);
}
.ul-list4y h3{font-size: 20px;font-weight: normal;padding-top: 65px;height: 40px;line-height: 40px;overflow: hidden;margin-bottom: 20px;}
.ul-list4y .txt2 p{height: 112px;overflow: hidden;}
.ul-list4y .txt2 span{display: inline-block;background: url(../images/gicon23.png) no-repeat center center;width: 17px;height: 17px;
     vertical-align: middle;
}

.m-morey a{display: block;height: 46px;line-height: 46px;overflow: hidden;padding-right: 24px;font-size: 14px;color: #000;
    background: url(../images/gicon16.png) no-repeat center right;text-align: right;
}
.m-morey a:hover{color: #12336d;}

.ind_con_le{ width:650px; float: left; display: block; position: relative; overflow: hidden;  }
.ind_con_le dl{ width: 315px; float: left; margin-right: 20px; display: block; position: relative; }
.ind_con_le dl:nth-child(2){ margin-right: 0; }
.ind_con_le dl dt{ width: 100%; display: block; position: relative;  }
.ind_con_le dl dt img{ width: 100%; height: 478px; display: block; }
.ind_con_le dl dd{ width: 100%; position: absolute; top: 0; left: 0; display: block; height: 430px; }
.ind_con_le dl dd h2{ font-size:24px; color: #fff; padding-left: 30px; padding-top: 100px; width: 100%; box-sizing: border-box; }
.ind_con_le dl dd span{ width: 100%; padding-left: 30px; padding-top: 20px; box-sizing: border-box; display: block; position: relative; overflow: hidden; font-size: 14px; color: #fff; }
.ind_con_le dl dd a{position: absolute;bottom: 40px; left: 0; font-size: 16px; color: #fff; background-color: #12336d; display: block; padding: 0 40px; border-radius: 0 20px 20px 0; height: 45px; line-height: 45px;}
.ind_con_rg{ width: 530px; float: right; box-sizing: border-box; background-color: #fff; padding: 24px; }
.ind_con_rg h2{ width: 100%; font-size: 26px; color: #000; text-align: center; display: block; position: relative; overflow: hidden; line-height: 50px; height: 50px; font-weight: normal; }
.ind_con_rg span{ width: 100%; font-size: 14px; color: #8c8c8c; line-height: 30px; height: 30px; display: block; position: relative; overflow: hidden; text-align: center; }
#myform_sy input[type="text"],#myform_sy select{ display: block; width: 100%;height: 34px;line-height: 34px; font-size: 14px;color: #b7b7b7; border: 1px solid #b7b7b7; box-sizing: border-box;}
.ind_con_msg{ width: 440px; margin: 0 auto; display: block; position: relative; padding: 15px 0; }
.ind_con_msg ul li{ width: 100%; display: block; float: left; margin: 6px 0; }
.ind_con_msg ul li img{float:left;margin-left:10px; }
.msg_inp{}

.msg_sel{}
.msg_yzm{float:left!important;width: 60%!important; }
.ind_con_pc{ width: 100%; height: 30px; line-height: 30px; font-size: 14px; color: #8c8c8c; display: block; text-align: center; position: relative; overflow: hidden; }
.msg_sub{ width: 220px; height: 40px; line-height: 40px; margin: 20px auto 0; display: block; background-color: #12336d; border-radius: 6px; font-size: 16px;color: #fff; border: none; } 





/* .ind_txt{ width: 100%; display: block; position: relative; overflow: hidden; padding-top: 35px; }

.ind_txt h2{font-size: 32px; color: #222; display: block; position: relative; text-align: center;}

.ind_txt h2 span{ margin: 0 20px;}

.ind_txt p{ font-size: 14px; color: #707070; width: 100%; display: block; position: relative; overflow: hidden; padding-top: 15px; text-align: center; } 
	 */     
.ind_service{background: #fff;position: relative; display: block; padding:20px 0; }

.ind_service_a{ width: 1200px; height: 185px; margin: 0 auto; padding-top: 35px; display: block; background: url(../images/ind_icon_38.png) no-repeat bottom center;     background-position: 0px 20px;position: relative; }

.ind_service_a ul li{ display: block; text-align: center; width: 171px; float: left; }

.ind_service_a ul li:last-child{ margin-right: 0; }

.ind_service_a_a{ width:60px; height: 60px; border-radius: 50%; background: #384f75; display: block; margin: 0 auto; }

.ind_service_a ul li:hover .ind_service_a_a{ background: #d90100;animation:grafpaintb 1s infinite ease-in-out}@keyframes grafpaintb{0%{transform:rotate(0deg)}10%{transform:rotate(10deg)}20%{transform:rotate(-10deg)}30%{transform:rotate(10deg)}40%{transform:rotate(-10deg)}50%{transform:rotate(0deg)}}

.ind_service_a_b{ font-size: 16px; padding: 10px 0 5px; display: block; position: relative; color: #000; width: 100%; float: left; }
.ind_service_a_b a{ color: #000; }
.ind_service_a_c{ font-size: 14px; display: block; position: relative; color: #707070; width: 100%; float: left;  } 

.ind_service_a_c span{color: #d90100;}













.specialx{/*padding:20px;background:#fff;*/}
.specialx:after{
    content: "";
    display: block;
    clear: both;
}
.specialx ul{}
.specialx ul li{ width: 228px;float: left;display: block; position: relative; margin-right: 15px;/*  transition: all .9s ease; */box-sizing: border-box;}
.specialx ul li:nth-child(5){margin-right:0;}
.specialx ul li:hover{box-shadow: 0 0 4px rgba(0, 0, 0, .2); }
.specialx ul li a{display:block;width:100%;display: block; overflow: hidden; position: relative; }
.specialx ul li a .img{ width: calc(100% + 20px); filter: blur(3px);backface-visibility: hidden; height:170px; display: block;
 -webkit-transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,transform .35s;
    transition: opacity .35s,transform .35s,-webkit-transform .35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden; 
   }
.specialx ul li a .itit{position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;padding:20px;box-sizing: border-box;background:rgb(0 39 51 / 30%);}
.specialx ul li a .itit h2{width: 100%;font-weight: bold;font-size: 18px;color: #fff; height: 25px; overflow: hidden; line-height: 25px; position: relative; display: block; }
.specialx ul li a .itit i{ display: block;
    width: 100%;height:45px;
    font-size: 12px;
    color: #d7d7d7;
    line-height: 14px;
    font-style: normal;
    margin: 8px 0px;}
.specialx ul li a .itit p{width:75%;font-size: 14px; line-height: 20px;overflow: hidden; position: relative; display: block;color: #fff; }
.specialx ul li a .itit span{    position: absolute;
    bottom: 30px;font-size: 12px;
    padding: 5px 20px;
    background:#12336d;
    border-radius: 4px;
    color: #fff;
}


.specialx ul li a:hover .img{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} 
.specialx ul li a:hover .itit{background: rgb(0 0 0 / 10%);} 
.specialx ul li a:hover .itit span{background: #000;} 
 .specialx ul li a:hover .itit h2,.specialx ul li a:hover .itit p,.specialx ul li a:hover .itit i{color: #000;} 
 .specialx ul li a:hover .itit h2{text-shadow: 2px 2px 2px rgba(255, 255, 255, 0.3);} 









.specialx2{/*padding:20px;background:#fff;*/}
.specialx2:after{
    content: "";
    display: block;
    clear: both;
}
.specialx2 ul{}
.specialx2 ul li{ width: 228px;float: left;display: block; position: relative; margin-right: 15px;/*  transition: all .9s ease; */box-sizing: border-box;}
.specialx2 ul li:nth-child(5){margin-right:0;}
.specialx2 ul li:hover{box-shadow: 0px 10px 15px 0px rgba(104, 111, 122, 0.15);}
.specialx2 ul li a{display:block;width:100%;display: block; overflow: hidden; position: relative; }
.specialx2 ul li a .img{ width: calc(100% + 20px); backface-visibility: hidden; height:140px; display: block;
 -webkit-transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,transform .35s;
    transition: opacity .35s,transform .35s,-webkit-transform .35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden; 
   }
.specialx2 ul li a .itit{background:#fff;font-size:16px;width: 100%;padding:10px;box-sizing: border-box;}



.specialx2 ul li a:hover .img{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} 

.specialx2 ul li a:hover .itit{} 

 .specialx2 ul li a:hover .itit{} 
 .specialx2 ul li a:hover .itit {} 














.sportx{/*padding:20px;background:#fff;*/height:170px;overflow:hidden;}
.sportx:after{
    content: "";
    display: block;
    clear: both;
}
.sportx ul{float:left;margin-right:15px;}
.sportx ul li{ width: 228px;float: left;display: block; position: relative; margin-right: 15px;/*  transition: all .9s ease; */box-sizing: border-box;}
.sportx ul li:nth-child(5){margin-right:0;}
.sportx ul li:hover{box-shadow: 0 0 4px rgba(0, 0, 0, .2); }
.sportx ul li a{display:block;width:100%;display: block; overflow: hidden; position: relative; }
.sportx ul li a .img{ width: calc(100% + 20px); height:170px; display: block;
 -webkit-transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,transform .35s;
    transition: opacity .35s,transform .35s,-webkit-transform .35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden; 
   }
.sportx ul li a .itit{position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;padding:20px;box-sizing: border-box;background:rgb(0 39 51 / 30%);}
.sportx ul li a .itit h2{width: 100%;font-weight: bold;font-size: 18px;color: #fff; height: 25px; overflow: hidden; line-height: 25px; position: relative; display: block; }
.sportx ul li a .itit i{ display: block;
    width: 100%;height:45px;
    font-size: 12px;
    color: #d7d7d7;
    line-height: 14px;
    font-style: normal;
    margin: 8px 0px;}
.sportx ul li a .itit p{width:75%;font-size: 14px; line-height: 20px;overflow: hidden; position: relative; display: block;color: #fff; }
.sportx ul li a .itit span{    position: absolute;
    bottom: 30px;font-size: 12px;
    padding: 5px 20px;
    background:#12336d;
    border-radius: 4px;
    color: #fff;
}


.sportx ul li a:hover .img{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} 
.sportx ul li a:hover .itit{background: rgb(0 0 0 / 10%);} 
.sportx ul li a:hover .itit span{background: #000;} 
 .sportx ul li a:hover .itit h2,.sportx ul li a:hover .itit p,.sportx ul li a:hover .itit i{color: #000;} 
 .sportx ul li a:hover .itit h2{text-shadow: 2px 2px 2px rgba(255, 255, 255, 0.3);} 









.sportx2{/*padding:20px;background:#fff;*/}
.sportx2:after{
    content: "";
    display: block;
    clear: both;
}
.sportx2 ul{}
.sportx2 ul li{ width: 228px;float: left;display: block; position: relative; margin-right: 15px;/*  transition: all .9s ease; */box-sizing: border-box;}
.sportx2 ul li:nth-child(5){margin-right:0;}
.sportx2 ul li:hover{box-shadow: 0px 10px 15px 0px rgba(104, 111, 122, 0.15);}
.sportx2 ul li a{display:block;width:100%;display: block; overflow: hidden; position: relative; }
.sportx2 ul li a .img{ width: calc(100% + 20px); backface-visibility: hidden; height:140px; display: block;
 -webkit-transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,-webkit-transform .35s;
    transition: opacity .35s,transform .35s;
    transition: opacity .35s,transform .35s,-webkit-transform .35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden; 
   }
.sportx2 ul li a .itit{background:#fff;font-size:16px;width: 100%;padding:10px;box-sizing: border-box;}



.sportx2 ul li a:hover .img{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} 

.sportx2 ul li a:hover .itit{} 

 .sportx2 ul li a:hover .itit{} 
 .sportx2 ul li a:hover .itit {} 
 
 
 
 
 
 
 
 
 
 
 
 
 .yjs-recommend {margin-bottom:20px;}
.yjs-recommend .title-module {margin-top:40px;}
.yjs-recommend .recommend {background-color:#ffffff;padding:20px 0;}

.yjs-recommend .recommend .tab-item {display:none;}
.yjs-recommend .recommend .tab-item.active {display:block;}
.yjs-recommend .recommend .tab-item ul li {float:left;background-color:#ffffff;margin-left:20px;margin-top:20px;position:relative;}
.yjs-recommend .recommend .tab-item ul li a {display: inline-block;width:216px;padding:17px 16px 14px;border:solid 1px #eeeeee; box-sizing: border-box;}
.yjs-recommend .recommend .tab-item ul li a:hover {-webkit-box-shadow:0px 10px 15px 0px rgba(104,111,122,0.15);box-shadow:0px 10px 15px 0px rgba(104,111,122,0.15);}
.yjs-recommend .recommend .tab-item ul li img {margin-bottom:15px;width:182px;height:60px;}
.yjs-recommend .recommend .tab-item ul li .text {text-align:center;border-top:1px solid #eeeeee;padding-top:10px;}
.yjs-recommend .recommend .tab-item ul li .text .name {font-size:14px;line-height:30px;font-weight:bold;color:#333333;}
.yjs-recommend .recommend .tab-item ul li .text p {font-size:14px;line-height:14px;color:#666666;}

.yjs-recommend .recommend .tab-item ul li .emphasis {position:absolute;top:-3px;right:0;}
.yjs-recommend .recommend .tab-item ul li .emphasis span {width:32px;height:16px;line-height:16px;text-align:center;font-size:12px;color:#ffffff;float:left;}
.yjs-recommend .recommend .tab-item ul li .emphasis span.first {background-image:-webkit-gradient(linear,left bottom,left top,from(#12336d),to(#3374e5)),-webkit-gradient(linear,left top,left bottom,from(#12336d),to(#12336d));background-image:linear-gradient(0deg,#12336d 0%,#3374e5 100%),linear-gradient(#12336d,#12336d);background-blend-mode:normal,normal;-webkit-box-shadow:0px 5px 10px 0px rgba(18,90,157,0.15);box-shadow:0px 5px 10px 0px rgba(18,90,157,0.15);}
.yjs-recommend .recommend .tab-item ul li .emphasis span.second {background-image:-webkit-gradient(linear,left bottom,left top,from(#17b3e6),to(#24c6fc)),-webkit-gradient(linear,left top,left bottom,from(#12336d),to(#12336d));background-image:linear-gradient(0deg,#17b3e6 0%,#24c6fc 100%),linear-gradient(#12336d,#12336d);background-blend-mode:normal,normal;-webkit-box-shadow:0px 5px 10px 0px rgba(26,169,216,0.15);box-shadow:0px 5px 10px 0px rgba(26,169,216,0.15);}