@charset "utf-8";

.content{width: 1200px; margin: 0 auto;}

i,em,b{font-style: normal;}



.tit01{ text-align: center;}

.tit01 h2{font-size: 36px; font-family: "Microsoft YaHei";color: #333333; font-weight: bold; line-height: 48px;}

.tit01 a{color: #333333; }

.tit01 em{font-weight: normal; font-size:12px;color: #b1b1b1; line-height: 22px;text-align: center; font-family: "Microsoft YaHei";position: relative;padding:0 60px;text-transform: uppercase; }

.tit01 em::before{content: "";position: absolute;width:55px;height:1px;background:#d8d8d8;left:0px;top:50%;}

.tit01 em::after{content: "";position: absolute;width:55px;height:1px;background:#d8d8d8;right:0px;top:50%;}






/**/

.g-guide{background:url(../images/guidebg.jpg) no-repeat center top;height: 752px;padding:60px 0 0px;box-sizing: border-box;font-family:"Microsoft Yahei";}

.guide dl{height: 305px;margin-bottom: 38px;}

.guide dt{width: 523px;height: 305px;overflow: hidden; position: relative;float: right;}

.guide dt i{width:100%; height: 100%;  display: block;background: url(../images/vdo-btn.png) no-repeat;background-size: 100%; position: absolute; left:0;top:0%; z-index: 1;}

.guide dt img{width:100%;display: block;}

.guide dd{width:630px;float: left;}

.guide dd h3{height:70px; line-height: 40px; font-size:32px; color: #333333; text-align: left;font-weight: bold;padding-left: 15px;position: relative;margin:10px 0 50px;}

.guide dd h3::after{content: "";position: absolute;width:5px;height:191px;background:url(../images/guide-line.png) no-repeat;left:0px;bottom:5px;z-index: 15;}

.guide dd em{font-size: 22px;color: #666666;font-weight: normal;display: block;}

.guide dd p{font-size:16px; color: #666666; line-height:30px;text-align: justify;}

.chara li {width:282px;height:300px;float: left;text-align: center;position: relative;box-sizing: border-box;margin-right: 24px;background:#fff url(../images/ico2.png) no-repeat center 24px;box-shadow: 7px 4px 10px 9px rgba(196, 196, 196, .35);padding:24px 35px 0;}

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

.chara li em{width:42px;height:42px; display:block;overflow: hidden;position: relative;z-index: 1;margin:33px auto 40px;}

.chara li em img{width:42px;display: block;position: absolute;left:0;top:0;-webkit-transition: 0.35s;-moz-transition:0.35s;transition: 0.35s;}

.chara li h4{font-size: 18px;color: #333333;line-height: 30px;margin-bottom: 20px;}

.chara li p{font-size: 14px;color: #666666;line-height: 24px;}

.chara li:hover{background:#0085e1 url(../images/ico1.png) no-repeat center 24px;; color: #fff;}

.chara li:hover h4{color: #fff;}

.chara li:hover p{color: #fff;}

.chara li:hover em img{top:-42px;}







/**/

.g-about{background:#fff url(../images/aboutbg.jpg) no-repeat center top;height:800px;overflow: hidden; font-family:"Microsoft Yahei";position: relative;box-sizing: border-box;padding-top: 65px;}

.g-about .tit01{ height:100px;}

.g-about .tit01 h2,.g-about .tit01 h2 a{color: #fff;}

.g-about .tit01 em{color: #fff;  }

.g-about .tit01 em::before{background:#fff;}

.g-about .tit01 em::after{background:#fff;}

.about dl dt{overflow: hidden;}

.about dl dt img{width: 100%;display: block;}

.about dl dd{height: 96px; font-size: 14px; color: #fff;line-height: 25px; text-align: center;   }

.about dl img{-webkit-transition: .3s;-moz-transition: .3s;transition: .3s;}

.about dl:hover img{-webkit-transform:scale(1.01);-moz-transform:scale(1.01);-ms-transform:scale(1.01);transform:scale(1.01);}



/**/

.g-show{height:auto;position: relative;padding-bottom: 108px;}

.show-nav{ height:45px;text-align: center;margin-bottom:32px;}

.show-nav a{line-height:45px;padding-left: 22px;box-sizing: border-box; width: 174px;font-size:20px; color: #333333;position: relative; display: inline-block;font-weight: normal;text-align: left;}

.show-nav em{width:44px;height:34px; display:block;overflow: hidden;position: relative;margin:5px 5px 0;float: left;}

.show-nav em img{width:44px;display: block;position: absolute;left:0;top:0;}



.show-nav a.cur em img,.show-nav a:hover em img{top:-34px;}

.show-nav a.cur,.show-nav a:hover{color: #004bbd; font-weight: bold;}



.show{position: relative;}

.show-prev{width:46px;height:46px;position: absolute;left:-86px;top:50%;margin-top:-23px;z-index: 1;}

.show-next{width:46px;height:46px;position: absolute;right:-86px;top:50%;margin-top:-23px;z-index: 1}

.show-nr{overflow: hidden; display: none;}

.show-nr li{ width:281px; position:relative;float: left; overflow: hidden;}

.show-nr li img{ display:block;width:100%; }

.show-nr li h4{font-size:14px;font-weight: normal; height:46px;line-height:46px; color:#3e4354;background:#efefef; text-align: center; white-space: nowrap;text-overflow: ellipsis; overflow:hidden;}

.show-nr li a{ text-decoration: none; }

.show-nr li img{-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}

.show-nr li:hover img{-webkit-transform:scale(1.05);-moz-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);}

.show-nr li:hover h4{background:#0085e1;color:#fff;}

.show-nr.on{display: block;}












@-webkit-keyframes spin{

  from {

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

  }



  50% {

    -webkit-transform: rotate(180deg);

    transform: rotate(180deg);

  }



  to {

    -webkit-transform: rotate(360deg);

    transform: rotate(360deg);

  }

}

@keyframes spin {

  from {

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

  }



  50% {

    -webkit-transform: rotate(180deg);

    transform: rotate(180deg);

  }



  to {

    -webkit-transform: rotate(360deg);

    transform: rotate(360deg);

  }

}





/*animation*/

@-webkit-keyframes hvr-buzz-out {

  10% {

    -webkit-transform: translateX(3px) rotate(2deg);

    transform: translateX(3px) rotate(2deg);

  }

  20% {

    -webkit-transform: translateX(-3px) rotate(-2deg);

    transform: translateX(-3px) rotate(-2deg);

  }

  30% {

    -webkit-transform: translateX(3px) rotate(2deg);

    transform: translateX(3px) rotate(2deg);

  }

  40% {

    -webkit-transform: translateX(-3px) rotate(-2deg);

    transform: translateX(-3px) rotate(-2deg);

  }

  50% {

    -webkit-transform: translateX(2px) rotate(1deg);

    transform: translateX(2px) rotate(1deg);

  }

  60% {

    -webkit-transform: translateX(-2px) rotate(-1deg);

    transform: translateX(-2px) rotate(-1deg);

  }

  70% {

    -webkit-transform: translateX(2px) rotate(1deg);

    transform: translateX(2px) rotate(1deg);

  }

  80% {

    -webkit-transform: translateX(-2px) rotate(-1deg);

    transform: translateX(-2px) rotate(-1deg);

  }

  90% {

    -webkit-transform: translateX(1px) rotate(0);

    transform: translateX(1px) rotate(0);

  }

  100% {

    -webkit-transform: translateX(-1px) rotate(0);

    transform: translateX(-1px) rotate(0);

  }

}

@keyframes hvr-buzz-out {

  10% {

    -webkit-transform: translateX(3px) rotate(2deg);

    transform: translateX(3px) rotate(2deg);

  }

  20% {

    -webkit-transform: translateX(-3px) rotate(-2deg);

    transform: translateX(-3px) rotate(-2deg);

  }

  30% {

    -webkit-transform: translateX(3px) rotate(2deg);

    transform: translateX(3px) rotate(2deg);

  }

  40% {

    -webkit-transform: translateX(-3px) rotate(-2deg);

    transform: translateX(-3px) rotate(-2deg);

  }

  50% {

    -webkit-transform: translateX(2px) rotate(1deg);

    transform: translateX(2px) rotate(1deg);

  }

  60% {

    -webkit-transform: translateX(-2px) rotate(-1deg);

    transform: translateX(-2px) rotate(-1deg);

  }

  70% {

    -webkit-transform: translateX(2px) rotate(1deg);

    transform: translateX(2px) rotate(1deg);

  }

  80% {

    -webkit-transform: translateX(-2px) rotate(-1deg);

    transform: translateX(-2px) rotate(-1deg);

  }

  90% {


    -webkit-transform: translateX(1px) rotate(0);

    transform: translateX(1px) rotate(0);

  }

  100% {

    -webkit-transform: translateX(-1px) rotate(0);

    transform: translateX(-1px) rotate(0);

  }

}