@charset "UTF-8";

html::-webkit-scrollbar{display: none;}
a{transition: all .5s;}

/*解决手机版点击背景问题*/
a:hover, a:visited, a:link, a:active , a:focus {
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
    outline: none;
    
}

/*锚点定位*/
.md{position: relative;top: -120px;}

/*过渡*/
.trans{transition: all .5s;}

/*阴影*/
.bx:hover{ box-shadow: 0px 0px 10px 0px rgba(0,0,0,.2)}

/*按钮效果*/
.more.mxg1 {
  -webkit-transition: 0.6s cubic-bezier(0.77, 0, 0.175, 1);
  transition: 0.6s cubic-bezier(0.77, 0, 0.175, 1);
  position: relative;
  z-index: 2;
  color: #fff;
}
.more.mxg1::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background:#013d6d;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: right;
          transform-origin: right;
  -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);
  transition: -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);
  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);
  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);
}
.more.mxg1:hover {
  color: #fff;
  background: transparent;
}
.more.mxg1:hover::before {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transform-origin: left;
          transform-origin: left;
}

/*放大图片*/
.bigimg{overflow: hidden;}
.bigimg img{display: block;transition: all .8s;}
.bigimg:hover img{transform:translateZ(0) scale(1.05);}

/*卡片翻转*/
@-webkit-keyframes flipOutYtest {
  from {
    -webkit-transform: perspective(1400px);
    transform: perspective(1400px);
  }

  40% {
    -webkit-transform: perspective(1400px) rotate3d(0, 1, 0, 60deg);
    transform: perspective(1400px) rotate3d(0, 1, 0, 60deg);
    opacity: 1;
  }

  50% {
    -webkit-transform: perspective(1400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(1400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }

  to {
    -webkit-transform: perspective(1400px) rotate3d(0, 1, 0, 180deg);
    transform: perspective(1400px) rotate3d(0, 1, 0, 180deg);
    opacity: 0;
  }
}

.test{
  -webkit-animation: flipOutYtest 0.75s linear;
  animation: flipOutYtest 0.75s linear;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}


@-webkit-keyframes flipInYtest {
  from {
    -webkit-transform: perspective(1400px) rotate3d(0, 1, 0, -180deg);
    transform: perspective(1400px) rotate3d(0, 1, 0, -180deg);
    opacity: 0;
  }

  50% {
    -webkit-transform: perspective(1400px) rotate3d(0, 1, 0, -90deg);
    transform: perspective(1400px) rotate3d(0, 1, 0, -90deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: perspective(1400px) rotate3d(0, 1, 0, -60deg);
    transform: perspective(1400px) rotate3d(0, 1, 0, -60deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(1400px);
    transform: perspective(1400px);
    opacity: 1;
  }
}

.test2{
  -webkit-animation: flipInYtest 0.75s linear;
  animation: flipInYtest 0.75s linear;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes roate {
  from {transform: rotate(0);}
  to {transform: rotate(360deg);}
}

/*input框*/

.input-box{outline: none; -webkit-appearance: none; /*去除系统默认的样式*/-webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* 点击高亮的颜色*/
}background-color: transparent;}
.input-box::-webkit-input-placeholder{color: #ccc;}
.input-box::-moz-placeholder {
  color: #ccc;
  opacity: 1;
}
.input-box:-ms-input-placeholder {
  color: #ccc;
}
.input-box::-webkit-input-placeholder {
  color: #ccc;
}
.input-box:placeholder-shown {
  text-overflow: ellipsis;
}

/*滚动条样式*/
.gdt{overflow: auto;}
.gdt::-webkit-scrollbar {
    width: 2px;
    height: 2px;
    padding-right: 10px
}

.gdt::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #eee
}

.gdt::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #303383;
}


body::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    padding-right: 10px
}

body::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #eee
}

body::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #303383;
}


/*悬浮下划线出现*/
.m-xhx{position: relative;}
.m-xhx:after{position: absolute;left: auto;right: 0;bottom: 0px;
width: 0;height: 1px;background-color: #999;transition: 0.2s cubic-bezier(0.260, 0.005, 0.000, 1.035);content: "";z-index: 1;}
.m-xhx:hover:after{right: auto;left: 0;width: 100%;}



/*单行超出省略*/
.m-sl{text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.m-twsl{display: -webkit-box!important;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
.m-thsl{display: -webkit-box!important;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}


/*通用*/
.ovhidden{overflow: hidden;}
.cz{position: relative; z-index: 22;}
.mflex{display: flex;flex-wrap: wrap;}

