:root {
  --px: 0;
  --py: 0;
}




.fancy-hover {
  background: rgb(99 99 99);
  color: #FFF;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  cursor: pointer;
  padding: 1em 1em;
  position: relative;
  overflow: hidden;
  border-bottom: solid 1px #444;
  z-index: 2;
  -webkit-transition: background-color 0.2s linear;
  transition: background-color 0.2s linear;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}


.fancy-hover:before,
.fancy-hover:after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -webkit-transition: opacity 0.1s linear;
  transition: opacity 0.1s linear;
}

.fancy-hover:before {
  width: 160px;
  height: 120px;
  background: radial-gradient(circle at center, #FFF 0%, transparent 60%); 
  opacity: 0;
  mix-blend-mode: screen;
  -webkit-transform: translate( 
    calc( var(--px) * 1px ),
    calc( var(--py) * 1px ) 
  ) translate(-50%, -50%);
          transform: translate( 
    calc( var(--px) * 1px ),
    calc( var(--py) * 1px ) 
  ) translate(-50%, -50%);
  
}

.fancy-hover:after {
  background: inherit;
  margin: 2px;
  top: 0; right: 0; bottom: 0; left: 0;
  opacity: 0;
  -webkit-transition-delay: 0.05s;
          transition-delay: 0.05s;
}


.fancy-hover:hover { background-color: rgba(78,78,78,0.9); }
.fancy-hover:hover:before { opacity: 0.6; }
.fancy-hover:hover:after { opacity: 0.85; -webkit-transition-delay: 0s; transition-delay: 0s; }

/* ////////////////////////////////////////////////////////////////////////// */

.fancy-hover--blue:hover { background-color: #24455E; }

/* ////////////////////////////////////////////////////////////////////////// */

.menu { overflow: hidden;  width: 10em; border-radius: 3px; opacity: 0.958; }
.menu :last-child { margin-bottom: 0; }
.fa { width: 1.25em; margin-right: 0.5em; font-size: 1.25em; text-align: center; }


#leftPos{
	/* position: fixed;
	top:40%;
	left:20px; */position: absolute;top: 350px;left: 43px;z-index: 999999;
}

.menu img{
	width: 32px;
    margin-right: 10px;
    margin-left: 10px;
}

.futitle{text-align:center;
	    color: #363F48;    font-size: 36px;
    line-height: 58px;
}

.futitleb{text-align:center;
	   color: #818e9b;   font-size: 16px;
    line-height: 26px;
}
.txkiang{
	margin:0 auto;width:80%;text-align: center;
}
.txkiang img{
	width:48%;margin-top:-30px;
}

.banben{
	border-radius: 44px;
    border: 4px solid white;
    padding-left: 20px;
    font-size: 40px;
    padding-right: 20px;
    font-weight: 500;
    margin-left: 30px;
}
.banben2{
	    width: 80%;
    font-size: 20px;
    letter-spacing: 2px;
    line-height: 36px;
    margin-top: 30px;
}
.banben3{
	font-size: 40px;
    letter-spacing: 3px;
}

/*  @media(min-width:1200px){
	.banben2{
	  font-size:20px;
	}
	.banben{
	  font-size:40px;
	}
}  */





.downBtn{
	width: 28%;
    background-color: #14b1fc;
    font-size: 22px;
    padding: 8px;
    text-align: center;
    letter-spacing: 2px;
    margin-top: 20px;cursor: pointer;
}

.downBtn img{
	    width: 27px;
    vertical-align: text-bottom;
}
 
.yaochuang{
	animation:move 3s 0s infinite;-webkit-animation:move 3s 0s infinite;transform-origin:bottom;-webkit-transform-origin:bottom;
}

@keyframes move
{
	0%, 65%{ 
	  -webkit-transform:rotate(0deg);
	  transform:rotate(0deg);
	}
	70% {  
	  -webkit-transform:rotate(6deg);
	  transform:rotate(6deg);
	}
	75% {  
	  -webkit-transform:rotate(-6deg);
	  transform:rotate(-6deg);
	}
	80% {  
	  -webkit-transform:rotate(6deg);
	  transform:rotate(6deg);
	}
	85% {  
	  -webkit-transform:rotate(-6deg);
	  transform:rotate(-6deg);
	}
	90% {  
	  -webkit-transform:rotate(6deg);
	  transform:rotate(6deg);
	}
	95% {  
	  -webkit-transform:rotate(-6deg);
	  transform:rotate(-6deg);
	}
	100% {  
	  -webkit-transform:rotate(0deg);
	  transform:rotate(0deg);
	}
}

@-webkit-keyframes move
{
	0%, 65%{ 
	  -webkit-transform:rotate(0deg);
	  transform:rotate(0deg);
	}
	70% {  
	  -webkit-transform:rotate(6deg);
	  transform:rotate(6deg);
	}
	75% {  
	  -webkit-transform:rotate(-6deg);
	  transform:rotate(-6deg);
	}
	80% {  
	  -webkit-transform:rotate(6deg);
	  transform:rotate(6deg);
	}
	85% {  
	  -webkit-transform:rotate(-6deg);
	  transform:rotate(-6deg);
	}
	90% {  
	  -webkit-transform:rotate(6deg);
	  transform:rotate(6deg);
	}
	95% {  
	  -webkit-transform:rotate(-6deg);
	  transform:rotate(-6deg);
	}
	100% {  
	  -webkit-transform:rotate(0deg);
	  transform:rotate(0deg);
	}
}

