﻿@charset "utf-8";
#header .menu ul li.default a{
    color: #0097be;
   border-top:3px solid #0097be;
   height: 62px;
   line-height: 62px;
}
#banner{
  margin-top: 110px;
}
#banner .item{
}

#banner .item .item-img{
  width: 100%;
  text-align: center;
}
#banner .item .item-img img{
  margin: 0 auto;
}
#banner .carousel-indicators LI{
  background: #fff;
}

/*#introduction {
  width: 96%;
  max-width: 1200px;
  overflow: hidden;
  margin: 100px auto;
}
#introduction h1{
  color: #606060;
  font-size: 30px;
  padding-top: 30px;
  padding-bottom: 30px;
  padding-left: 20px;
  padding-right: 20px;
}

#introduction p{
  color: #606060;
  font-size: 16px;
  padding: 0 20px;
}
#introduction .con{
  overflow: hidden;
  margin: 20px;
}
#introduction .con .introduction-list{
  text-align: center;
  padding: 0;
}
#introduction .con .introduction-list img{
  margin: 0 auto;
  width: 100px;
}
#introduction .con .introduction-list h2{
  color: #535353;
  font-size: 24px;
  padding: 30px 0;
}
#introduction .con .introduction-list p{
  color: #535353;
  text-align: left;
  font-size: 16px;
  line-height: 24px;
  padding: 0;
}
#introduction .con .col-sm-4 p{*/
  padding: 0 30px;
}
@media screen and (max-width: 768px) { 
  #introduction {
    width: 96%;
    max-width: 1200px;
    overflow: hidden;
    margin: 10px auto;
  }

  #introduction h1{
    font-size: 16px;
    line-height: 24px;
    padding: 0 2% 20px 2%;
  }  
  #introduction p{
    color: #606060;
    font-size: 14px;
    padding: 0 2%;
  } 

  #introduction .con{
    overflow: hidden;
    margin: 20px 0;
  }
  #introduction .con .introduction-list{
    text-align: center;
    padding: 20px 0 0 0;
  }

  #introduction .con .introduction-list img{
    margin-right: 5px;
    width: 20%;
    margin-left: 1%;
    float: left;
  }  
  #introduction .con .introduction-list h2{
    text-align: left;
    color: #535353;
    font-size: 14px;
    padding: 0 3% 0 70px;
  }  
  #introduction .con .introduction-list p{
    text-align: left;
    padding: 0 3% 0 70px;
    font-size: 14px;
  }

  #introduction .con .col-sm-4 p{
    padding: 0 3% 0 70px;
    text-align: left;
  }
} 



#jd {
  width: 96%;
  max-width: 1200px;
  margin: 100px auto;
}

#jd .con{
  padding: 100px 10px 0 100px;
}
#jd .con h2{
  font-size: 24px;
  color: #0097be;
  padding-bottom: 15px;
}
#jd .con p{
  color: #606060;
  font-size: 16px;
}
#jd .glyphicon-chevron-right{
  text-align: -9999px;
  display: none;
}
#jd .glyphicon-chevron-left{
  text-align: -9999px;
  display: none;
}

@media screen and (max-width: 768px) { 
   #jd {
    margin: 20px auto;
  } 
  #jd .con{
    padding: 10px 4% 0 4%;
  }
  #jd .con h2{
    font-size: 16px;
    color: #0097be;
    padding-bottom: 15px;
  }
  #jd .con p{
    color: #606060;
    font-size: 14px;
  }

  #jd .video img{
    width: 100%;
  }
} 


.reveal-modal .reveal-modal-con {
  top: 50%;
  left: 50%;
  margin-left: -400px;
  margin-top: -250px;
  width: 800px;
  background: url(../img/tan-out.png);
  position: fixed;
  z-index: 101;
  padding: 0px;
  }
.reveal-modal .reveal-modal-con-m {
  top: 50%;
  left: 50%;
  margin-left: -160px;
  margin-top: -150px;
  width: 320px;
  background: url(../img/tan-out.png);
  position: fixed;
  z-index: 101;
  padding: 0px;
  display: none;
  }

@media screen and (max-width: 768px) { 
  .reveal-modal .reveal-modal-con {
    display: none;
    }
  .reveal-modal .reveal-modal-con-m {
    display: block;
    }

} 


.carousel-indicators2{
  left: 310px;
}
@media screen and (max-width: 768px) { 
  .carousel-indicators2{
    left: 0;
  }
}

.carousel-control.left{
   background-image: none;
   background: url(../img/left.png) no-repeat center center;
   width: 5%;
   left: -50px;
   filter:none;
}
.carousel-control.right{
   background-image: none;
   background: url(../img/right.png) no-repeat center center;
   width: 5%;
   right: -50px;
   filter:none;
}
@media screen and (max-width: 768px) { 
  .carousel-control.left{
     background-image: none;
     background: url(../img/left.png) no-repeat center center;
     background-size: 70%;
     width: 4%;
     left: 0px;
     top: 60px;
     height: 100px;
     filter:none;
  }
  .carousel-control.right{
     background-image: none;
     background: url(../img/right.png) no-repeat center center;
     background-size: 70%;
     width: 4%;
     right: 0px;
     top: 60px;
     height: 100px;
     filter:none;
  }
}


#link{
  background: #f2f3f4;
  width: 100%;
  overflow: hidden;
}
#link .content{
  max-width:1200px;
  margin: 50px auto;  
}
#link h1{
  text-align: center;
  color: #606060;
  font-size: 30px;
  padding-bottom: 20px;
}
#link ul{
  display: block;
  overflow: hidden;
}
#link ul li{
  border-left: 1px solid #ececec;
  border-top: 1px solid #ececec;
  float: left;
  list-style-type: none;
}
@media screen and (max-width: 768px) { 
  #link .content{
    max-width:1200px;
    margin: 20px auto;  
  }
  #link h1{
    text-align: center;
    color: #606060;
    font-size: 20px;
    padding-bottom: 20px;
  }


  #link ul li{
    border-left: 1px solid #ececec;
    border-top: 1px solid #ececec;
    width: 50%;
    float: left;
    list-style-type: none;
  }
  #link ul li.end{
    display: none;
  }  
  #link ul li img{
    width: 100%;
  }

}

#link ul li a{ 
  display: block;
  position: relative;}
#link ul li a span{
  position: absolute;
  top: 0;
  left: 0;
}
#link ul li a:hover span{
  filter: alpha(opacity=0);
  opacity: 0;  
  -webkit-transition: all 0.2s ease-in;
   -moz-transition: all 0.2s ease-in;
   -o-transition: all 0.2s ease-in;
   -ms-transition: all 0.2s ease-in;
   transition: all 0.2s ease-in;
}
#link .nav {
  margin: 30px 0;
  color: #a5a5a5;
  font-size: 16px;
}
@media screen and (max-width: 768px) { 
  #link .nav {
    display: none;
  }

}
#link .nav span{
  padding: 0 5px;
  color: #a5a5a5;
  font-size: 16px;
}
