﻿.box-ceshi img {
  width: 100%; }
.content-container{
  position: relative;
}
.content-container .vedio{
  right: 0;
  top: 70%;
  height: 150px;
  width: 300px;
  
  position: fixed;
  z-index: 300;
}

.content-container .vedio img{
  width: 100%;
  height: 100%;
}
.content-container .vedio .vedioPlay{
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  font-size: 40px;
  color: #ffffff;
  transform: translate(-50%, -50%);
}
.home-first {
padding: 0 2%;
height: 70px;
line-height: 70px;
border-bottom: 1px solid #E8E8E8;
box-sizing: border-box; }
.home-first .news {
  margin-right: 70px;
  color: #EA5504;
  font-size: 20px;
  float: left;
  line-height: 65px; }
  .home-first .news i {
    font-size: 20px;
    color: #EA5504; }
.home-first .list-news {
  overflow: hidden;
  width: 75%;
  float: left; }
  .home-first .list-news .demo-box {
    float: left;
    width: 1000%;
    white-space: nowrap; }
  .home-first .list-news .my-news {
    position: relative;
    padding: 0 15px 0 10px;
    font-size: 16px;
    max-width: 200px;
    color: #333;
    height: 25px;
    box-sizing: border-box;
    line-height: 25px; }
    .home-first .list-news .my-news::before {
      content: '';
      display: inline-block;
      width: 5px;
      height: 5px;
      background-color: #EA5504;
      border-radius: 50%;
      position: absolute;
      left: 0;
      top: 10px; }
    .home-first .list-news .my-news:hover {
      color: #F88F16; }
.home-first .more {
  float: right;
  color: #4077DC;
  font-size: 16px; }
  .home-first .more i {
    font-size: 16px;
    color: #4077DC;
    position: relative;
    top: 1px; }

.ball-content path {
fill: none;
stroke: rgba(144, 206, 248, 0.5); }
.ball-content .point {
fill: #39b2b1; }
.ball-content .point1 {
fill: red; }
.ball-content #tw_logo {
background: linear-gradient(to right, transparent 50%, rgba(229, 7, 30, 0.5)) #333;
background-size: auto 100%;
text-align: center;
margin: 0 auto;
box-sizing: unset;
padding: 100px; }
.ball-content #tw_logo .logo-title {
  font-size: 32px;
  text-align: center;
  height: 50px;
  line-height: 50px;
  position: relative;
  width: 1000px;
  margin: 0 auto;
  padding-bottom: 200px;
  color: #ffffff; }
  .ball-content #tw_logo .logo-title .logo-ball {
    font-size: 32px;
    width: 400px;
    height: 400px;
    
      position: absolute;
      left: 305px;
      top: 170%;
      z-index: 0; }
    .ball-content #tw_logo .logo-title .describe {
      color: #61e2ff;
      position: absolute;
      font-size: 24px;
      font-weight: bold;
      left: 0;
      top: 0;
      overflow: hidden;
      height: 50px;
      line-height: 50px;
      text-align: left;
      transform: translateX(-100vw); }
    .ball-content #tw_logo .logo-title #design {
      animation: sideSlide 3s 1s forwards; }
    .ball-content #tw_logo .logo-title #construct {
      animation: sideSlide 3s 2s forwards; }
    .ball-content #tw_logo .logo-title #service {
      animation: sideSlide 3s 3s forwards; }
    .ball-content #tw_logo .logo-title #teaching {
      animation: sideSlide 3s 4s forwards; }
    .ball-content #tw_logo .logo-title #content {
      animation: sideSlide 3s 5s forwards; }
@keyframes sideSlide {
  15%, 20% {
    transform: translateX(0.5em) scale(1);
    transition: 0.5s; }
  24% {
    transform: translateX(0) scale(1.2);
    transition: 0.5s; }
  25%, 75% {
    transform: translateX(0) scale(1);
    filter: opacity(1);
    transition: 0.5s; }
  90%, 100% {
    transform: translateX(0vw);
    filter: opacity(1);
    transition: 0.5s; } }
.card-show {
  min-height: 500px;
  background-color: #F5F5FF;
  padding: 5% 15% 5% 15%; }
  .card-show .title {
    text-align: center;
    color: #333; }
  .card-show .tit-border {
    width: 12%;
    height: 4px;
    margin: 0 auto;
    background-color: #DF2433; }
  .card-show .card-content {
    width: 100%;
    height: 550px;
    display: flex;
    flex-direction: row; }
    .card-show .card-content .content-one {
      display: flex;
      flex-direction: column; }
    .card-show .card-content .content-two {
      display: flex;
      flex-direction: row;
      width: 100%;
      height: 34%; }
    .card-show .card-content .w1 {
      width: 40%; }
    .card-show .card-content .w2 {
      width: 60%; }
    .card-show .card-content .w3 {
      width: 100%; }
    .card-show .card-content .w4 {
      width: 27%; }
    .card-show .card-content .w5 {
      width: 46%; }
    .card-show .card-content .hi1 {
      height: 50%; }
    .card-show .card-content .list {
      text-align: center;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      color: #ffffff;
      overflow: hidden; }
      .card-show .card-content .list .list-img {
        position: absolute;
        left: 0;
        top: 0;
        object-fit: cover;
        z-index: 205;
        max-width: none;
        filter: contrast(0.8) brightness(0.5);
        transform: scale(1);
        transition: all 0.5s; }
      .card-show .card-content .list .line {
        width: 78px;
        height: 2px;
        background-color: #ffffff;
        z-index: 240;
        margin: 10px 0; }
      .card-show .card-content .list .list-title {
        font-size: 20px;
        z-index: 240; }
      .card-show .card-content .list .meng {
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        position: absolute;
        background-color: rgba(229, 7, 30, 0.6);
        transform: translateY(3vw);
        transition: all .3s ease; }
      .card-show .card-content .list .list-content {
        font-size: 14px;
        max-width: 80%;
        overflow: hidden;
        color: #ffffff;
        z-index: 230;
        flex: 0 0 0;
        transition: all .3s ease; }
    .card-show .card-content .list:hover {
      cursor: pointer; }
      .card-show .card-content .list:hover .meng {
        z-index: 230;
        transform: translateY(0vw); }
      .card-show .card-content .list:hover .list-content {
        flex: 0 0 50px; }
      .card-show .card-content .list:hover .list-img {
        transform: scale(1.1);
        transition: all 0.5s; }