@charset "utf-8";
/* CSS Document */
#bannervideo {

    position: relative;

    width: 100%;

}

#bannervideo video {

    width: 100%;

}
video {
    display: inline-block;
    vertical-align: baseline;
}
.shows {

    background: url("../images/show.png") repeat scroll 0 0 rgba(0, 0, 0, 0);

    height: 100%;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    z-index: 99;

}

#bannervideo .main_title {

    background: url(../images/main_title.png) no-repeat scroll center center rgba(0, 0, 0, 0);

    height: 200px;

    left: 50%;

    margin-left: -250px;

    margin-top: -200px;

    position: absolute;

    top: 50%;

    width: 500px;

    z-index: 999;

}
.bgt{
    background: url("../images/t.png") no-repeat scroll center center rgba(0, 0, 0, 0);
    display: block;
    font-size: 16px;
	margin-top: -30px;
}
.h220{ width:240px; height:240px; position: relative;}
.h220 a img{border-radius: 50%;width:220px; height:220px; position:absolute;z-index:1; top:10px; left:25px;}
.h220 a:hover .borderbg{ background: rgba(0,0,0,0.85);}
.h220 a:hover .unit-body{opacity: 1; color:#fff;}
.h220 a .unit-body{ font-family:Cambria;  top:90px; left:70px; position: relative; font-size:24px; color:rgba(82,82,82,1.00);z-index:50; opacity: 0; -webkit-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; transition: all .8s ease-in-out;}
.h220 a .borderbg{position:absolute; width: 240px;height: 240px;border: 10px solid #ecab18; border-right-color: #24a3d8;border-bottom-color: #24a3d8;border-radius: 50%; -webkit-transition: all .8s ease-in-out;-moz-transition: all .8s ease-in-out; transition: all .8s ease-in-out;z-index:20;}
.h220 a:hover .borderbg{ -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }


.btn-go-down{display:block;width:43px;height:43px;background:url(../images/arrow_go_down.png) center center no-repeat;opacity:0.5;filter:alpha(opacity=50); margin:0px auto 10px auto; position:relative;z-index:99999999999}
.btn-go-down:hover{-moz-transform:translateY(10px);-webkit-transform:translateY(10px);-ms-transform:translateY(10px);-o-transform:translateY(10px);transform:translateY(10px);opacity:1;filter:alpha(opacity=100); }


.beforeandafter {
  /* main container */
  background: white;
  display: block;
  overflow: hidden;
  position: relative;
  height: 173px;
  width: 290px;
  margin: 0 auto; }
  @media (min-width: 1200px) {
    .beforeandafter {
      width: 670px;
      height: 400px; } }
  @media (min-width: 768px) and (max-width: 1199px) {
    .beforeandafter {
      width: 495px;
      height: 295px; } }

.before img {
  max-width: none; }

.before, .after {
  /* before and after DIVs within main container */
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  transition: width 0.4s ease-in-out;
  /* CSS transition. Actual duration set inside script (options.revealduration) */
  width: 100%;
  z-index: 100; }

.after {
  z-index: 1;
  /* z-index of after div should be smaller than before's */ }
  
  #map{    background: none repeat scroll 0 0 #000;
    height: 350px;
    width: 100%;}
.contact{    color: #ababab;  height: 42px;
    line-height: 42px;
    margin-bottom: 1px;}
.contactindex i{    background: none repeat scroll 0 0 #434343;
    display: inline-block;
    font-size: 24px;
    height: 42px;
    line-height: 42px;
    margin-right: 10px;
    text-align: center;
    vertical-align: top;
    width: 42px;}
.quote-variant-1 q {
    font-family: "微软雅黑";
}