body {
            margin: 0px;
            font-family: 黑体;
        }

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

        .col-sm-6 {
            float: left;
            width: 50%;
margin-bottom:36px;
        }

        .col-sm-3 {
            float: left;
            width: 25%;
        }

        .col-sm-4 {
            float: left;
            width: 33.3%;
        }

        .clearfix:after {
            content: ".";
            display: block;
            clear: both;
            visibility: hidden;
            font-size: 0;
            height: 0;
        }

        .pic-banner {
            background-image: url(../images/banner3.png);
            height: 600px;
            background-position: center;
            position: relative;
        }

        .pic-banner>a,.pic-banner>a:hover {
            position: absolute;
            top: 400px;
            text-decoration: none;
            background-color: #0aa1f1;
            padding: 10px 27px;
            border-radius: 7px;
            left: 50%;
            font-size: 23px;
            margin-left: -576px;
            display: inline-block;

            position: relative;
  display: inline-block;
  color: #ffffff;
  text-transform: uppercase;
  overflow: hidden;
  transition: .5s;
  letter-spacing: 4px
        }

.pic-banner a:hover {
  /*background: #03e9f4;*/
  color: #fff;
  border-radius: 5px;
  box-shadow: 0 0 5px #03e9f4,
              0 0 25px #03e9f4,
              0 0 50px #03e9f4,
              0 0 100px #03e9f4;
}

.pic-banner a span {
  position: absolute;
  display: block;
}

.pic-banner a span:nth-child(1) {
  top: 0;
  left: -100%;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #03e9f4);
  animation: btn-anim1 1s linear infinite;
}

@keyframes btn-anim1 {
  0% {
    left: -100%;
  }
  50%,100% {
    left: 100%;
  }
}

.pic-banner a span:nth-child(2) {
  top: -100%;
  right: 0;
  width: 2px;
  height: 100%;
  background: linear-gradient(180deg, transparent, #03e9f4);
  animation: btn-anim2 1s linear infinite;
  animation-delay: .25s
}

@keyframes btn-anim2 {
  0% {
    top: -100%;
  }
  50%,100% {
    top: 100%;
  }
}

.pic-banner a span:nth-child(3) {
  bottom: 0;
  right: -100%;
  width: 100%;
  height: 2px;
  background: linear-gradient(270deg, transparent, #03e9f4);
  animation: btn-anim3 1s linear infinite;
  animation-delay: .5s
}

@keyframes btn-anim3 {
  0% {
    right: -100%;
  }
  50%,100% {
    right: 100%;
  }
}

.pic-banner a span:nth-child(4) {
  bottom: -100%;
  left: 0;
  width: 2px;
  height: 100%;
  background: linear-gradient(360deg, transparent, #03e9f4);
  animation: btn-anim4 1s linear infinite;
  animation-delay: .75s
}

@keyframes btn-anim4 {
  0% {
    bottom: -100%;
  }
  50%,100% {
    bottom: 100%;
  }
}

        .pic-nanti {

            margin-top: 40px;
        }

       

        .tip {
            margin-top: 46px;
            font-size: 30px;
        }
.tip>p{
text-align:center;
}

        .center-text {
            font-size: 37px;
            text-align: center;
            margin-top: 56px;

        }

        .tip-btn {
            color: #fff;
            background-color: #00C2FF;
            padding: 12px 37px;
            text-decoration: none;
            font-size: 16px;
            display: inline-block;
        }

        .youshi-item {
            background-repeat: no-repeat;
            background-position: top center;
            padding-top: 110px;
            cursor: default;
            margin-top: 30px;
            transition: 0.3s ease-in-out all;
margin-bottom:36px;
text-align:center;
        }

        .youshi-item:hover {
            box-shadow: 14px 10px 21px 4px #efefef
        }

        .youshi-head {
            font-size: 24px;
            margin-top: 26px;
            margin-bottom: 15px;
            height: 20px;
        }
        .youshi-head{
            height: 20px;
        }
        .youshi-info{
            height: 19px;
margin-bottom:7px;
        }

        .jiejue {
            margin-top: 46px;
        }

        .liaojie-item {
            height: 445px;
            background-size: 100%;
            position: relative;
        }

        .liaojie-item:hover>.liaojie-item-hover {
            opacity: 1;
        }

        .liaojie-item:hover>.liaojie-item-icon {
            top: 12%;
            transform: scale(1);
        }

        .liaojie-item:hover>.liaojie-item-text-head {
            top: 34%;

        }

        .liaojie-item-hover {
            position: absolute;
            top: 0px;
            bottom: 0px;
            left: 0px;
            right: 0px;
            opacity: 0;
            transition: 0.6s ease-in-out all;
            cursor: default;
            z-index: 1;
        }

        .liaojie-item-bg {
            position: absolute;
            top: 0px;
            bottom: 0px;
            left: 0px;
            right: 0px;
            background-color: #187AF5;
            opacity: 0.5;
            z-index: -1;
        }

        .liaojie-item-icon {
            position: absolute;
            top: 29%;
            left: 0px;
            right: 0px;
            height: 83px;
            background-repeat: no-repeat;
            background-position: center;
            z-index: 2;
            transition: 0.6s ease-in-out all;
            transform: scale(0.8);
        }

        .liaojie-item-text {
            position: absolute;
            top: 47%;
            left: 0px;
            right: 0px;
            bottom: 0px;
            z-index: 2;
            text-align: center;
        }

        .liaojie-item-text>a,.liaojie-item-text>a:hover {
            border: 1px solid #fff;
            border-radius: 4px;
            padding: 4px 11px;
            display: inline-block;
            color: #fff;
            margin-top: 30px;
            text-decoration: none;
        }

        .liaojie-item-text-head {
            color: #fff;
            font-size: 18px;
            margin-bottom: 34px;
            position: absolute;
            left: 0px;
            right: 0px;
            top: 58%;
            z-index: 2;
            transition: 0.6s ease-in-out all;
text-align:center;
        }

        .liaojie-item-text-info {
            color: #fff;
            font-size: 12px;
        }

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

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

        .guangying-tab-item {
            height: 70px;
            position: relative;
            background-color: #eeeeee;
            transition: 0.5s ease-in-out all;
        }

        .guangying-tab-item.action {
            background-color: #59C2FF;
        }

        .guangying-tab-item em {
            position: absolute;
            width: 64px;
            display: inline-block;
            height: 48px;
            background-size: 100%;
            margin-top: -24px;
            left: 50%;
            top: 50%;
            margin-left: -64px;
            background-repeat: no-repeat;

        }

        .guangying-tab-item span {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -9px;
            margin-left: 5px;
        }

        .guangying-tab-item.action span {
            color: #ffffff;
        }

        .guangying-pic {
            width: 1200px;
            margin: 0 auto;
            height: 634px;
            position: relative;
        }

        .guangying-pic img {
            width: 100%;
            position: absolute;
            top: 0px;
            left: 0px;
            z-index: 1;
            opacity: 0;
            transition: 0.5s ease-in-out all;
        }

        .guangying-pic img.action {
            z-index: 2;
            opacity: 1;
        }