#mobile_sport_1{
  display: none;
}

.sport-1-area{
  display: flex;
  flex-direction: row;

  margin-top: 40px;
}

.sport-1-items{
  width:33.33%;
  height: 80px;
}

.sport-1-item{
  display: flex;
  flex-direction: column;

  justify-content:center;
}

.sport-1-item-area{
  display: flex;
  flex-direction: row;

  height: 100%;
  border: 1px solid #e6e6e5;
  border-radius:5px;

  transition: border 0.5s ;
  -o-transition: border 0.5s ; /*兼容parsto内核*/
  -moz-transition: border 0.5s ; /*兼容gecko内核*/
  -webkit-transition: border 0.5s ; /*兼容webkit内核*/

  transition: box-shadow 0.5s ;
  -o-transition: box-shadow 0.5s ; /*兼容parsto内核*/
  -moz-transition: box-shadow 0.5s ; /*兼容gecko内核*/
  -webkit-transition: box-shadow 0.5s ; /*兼容webkit内核*/
}

.sport-1-item-area .s1-logo{
  margin-left: 10px;
  margin-right: 20px;
}

.sport-1-item-area .s1-info{
  flex:1;
  margin-right: 20px;
  color:#222222;
  text-align: right;
  display: flex;
  /*实现垂直居中*/
  align-items: center;
  justify-content:flex-end

}

.sport-1-item-area:hover{
  border: 1px solid rgba(230,230,229,0);
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  
  transition: box-shadow 0.5s ;
  -o-transition: box-shadow 0.5s ; /*兼容parsto内核*/
  -moz-transition: box-shadow 0.5s ; /*兼容gecko内核*/
  -webkit-transition: box-shadow 0.5s ; /*兼容webkit内核*/

  transition: border 0.5s ;
  -o-transition: border 0.5s ; /*兼容parsto内核*/
  -moz-transition: border 0.5s ; /*兼容gecko内核*/
  -webkit-transition: border 0.5s ; /*兼容webkit内核*/
}

.sport-1-item-area:hover .s1-info{
  color:#f2961f;
}

.sport-1-item-select{
  width:37px;
  margin:0 auto;
  margin-top:10px;
  visibility:hidden;
}

.sport-1-pop-area{
  height: 0px;
  overflow: hidden;

  transition:height 0.5s ;
  -o-transition: height 0.5s ; /*兼容parsto内核*/
  -moz-transition: height 0.5s ; /*兼容gecko内核*/
  -webkit-transition: height 0.5s ; /*兼容webkit内核*/
}


.sport-2-area{
  width:50%;
  display: flex;
  flex-direction: column;
  flex-wrap:wrap;

  margin-top: 60px !important;
}

.sport-2-area-item{
  /* margin-top: 40px; */
  

  padding-bottom: 30px;

}

.sport-2-content{
  display: flex;
  flex-direction: row;
}

.sport-2-item .sport-2-f{
  display: flex;
  flex-direction: row;
  align-items: center;
  /* justify-content:center; */

  padding-top: 10px;
  
  background:white;
}


.sport-2-item .sport-2-f > img{
  margin-left:20px;
}

.sport-2-item-info{
  flex:1;
  margin-left:20px;
}

.sport-2-item .sport-2-s{
  background:white;

  padding-left: 30px;
  /* padding-top:10px; */

  height: 0;
  overflow: hidden;
  transition:height 0.5s ;
  -o-transition: height 0.5s ; /*兼容parsto内核*/
  -moz-transition: height 0.5s ; /*兼容gecko内核*/
  -webkit-transition: height 0.5s ; /*兼容webkit内核*/
}


.sport2-s-info{
  display: flex;
  flex-direction: row;

  margin-top:10px;
}

.sport2-s-info .ss-title{
  width:120px;
}

.sport2-s-info .ss-desc{
  flex:1;
  margin-right:20px;
}

.sport-3-area{
  display: flex;
  flex-direction: row;
  flex-wrap:wrap;

  margin-top:30px;
}

.sport-3-area .sport-3-item{
  height:300px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}

.sport-3-item-content{
  position: relative;
  background-color: rgba(0,0,0,0.7);
  height: 100%;
  width: 100%;
}

.sport-3-item-0{
  width:30%;
}

.sport-3-item-1{
  width:37%;
}

.sport-3-item-2{
  width:33%;
}

.sport-3-item-3{
  width:18%;
}

.sport-3-item-4{
  width:52%;
}

.sport-3-item-5{
  width:30%;
}

.sport-3-item-6{
  width:50%;
}

.sport-3-item-7{
  width:50%;
}

/* .sport-3-item-8{
  width:37%;
} */

.sport-3-area .sport-3-pic{
  top: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;

  transition: all 0.5s;
  -o-transition: all 0.5s ; /*兼容parsto内核*/
  -moz-transition: all 0.5s ; /*兼容gecko内核*/
  -webkit-transition: all 0.5s ; /*兼容webkit内核*/
}

.sport-3-area .sport-3-pic-40 {
  background-size: 40%;
}

.sport-3-area .sport-3-pic-35 {
  background-size: 35%;
}

.sport-3-area .sport-3-pic-30 {
  background-size: 30%;
}

.sport-3-area .sport-3-pic-25 {
  background-size: 25%;
}


.sport-3-area .sport-3-pic-20 {
  background-size: 20%;
}

.sport-3-area .sport-3-item:hover .sport-3-pic{
  transform: scale(0.7);
}

.sport-3-info{
  position: absolute;
  bottom: -80px;
  width:100%;
  color: white;
  text-align: center;

  /* background-color: rgba(0,0,0,0.7); */

  z-index: 999;
  padding-top: 10px;
  padding-bottom: 10px;

  transition: all 0.5s;
  -o-transition: all 0.5s ; /*兼容parsto内核*/
  -moz-transition: all 0.5s ; /*兼容gecko内核*/
  -webkit-transition: all 0.5s ; /*兼容webkit内核*/
}

.sport-3-area .sport-3-item:hover .sport-3-info{
  bottom:0;
}

.sport-3-info > div{
  padding-left: 20px;
  padding-right: 20px;
}

.sport-3-bottom{
  display: flex;
  align-items: center;

  height: 120px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.sport-3-bottom > img{
  height: 80px;
  margin-left: 80px;
}

.sport-3-bottom > div{
  margin-left: 80px;
  margin-right: 20px;
}

