@font-face {
    			font-family: "DSketch";
    			src: url("../font/DSketch.otf");
    		}
    		#app>.middle{
    			position: relative;
    			height: 19vw;
    		}
    		#app>.middle>.ad{
    			width: 100%;
    			position: absolute;
    		}
    		#app>.middle ul{
    			padding: 0;
    			margin: 0;
    		}
    		#app>.middle li{
    			list-style: none;
    			
    		}
    		#app>.middle>.ad ul{
    			display: flex;
    			position: relative;	
    			height: 19vw;
    		}
    		#app>.middle>.ad li{
    			width: 100%;
    			height: 19vw;
    			background-size: 100%;
    			position: absolute;
    			transition: all 1.5s;
    			opacity: 0;
    			z-index: 0;
    		}
    		#app>.middle>.ad .ahead{
    			z-index: 99;
    			transition: all 1.5s;
    			opacity: 1;
    		}
    		#app>.middle>.ad-sel{
    			width: 100%;
    			position: absolute;
    			z-index: 99;
    			/* top: 5vw; */
    			bottom: 0;
    			display: flex;
    			justify-content: flex-end;
    		}
    		#app>.middle>.ad-sel ul{
    		    padding: 0 .8vw .4vw 0;
    			height: 1vw;
    			position: relative;
    			display: flex;
    			align-items: center;
    		}
    		#app>.middle>.ad-sel li{
    			width: .4vw;
    			height: .4vw;
    			background-color: rgba(248, 248, 255, 0.6);
    			border-radius: .8vw;
    			margin-right: .2vw;
    		}
    		#app>.middle>.ad-sel .run{
    			background-color: rgba(69, 69, 69, 0.6);
    			width: .5vw;
    			height: .5vw;
    		}
    		#app>.content{
    		    width: 100%;
    		    display: flex;
    		    flex-direction: row;  
    		    flex-wrap: wrap;
    		}
    		#app>.content>div{
    		     width: 50%;
    		}
    		#app>.content h1{
    			font-family: 'DSketch';
    			font-size: 5vw;
    		}
    		#app>.content ul{
    			list-style: none;
    			padding: 0 0 0 4vw;
    		}
    		#app>.content ul li{
    			margin: 1vw 0;
    			display: flex;
    		}
    		#app>.content ul li>a:hover{
    			box-shadow: -.2vw .2vw 1px 0 gray;
    		}
    		#app>.content ul li>a{
    			display: inline-block;
    			height: 3vw;
    			text-align: center;
    			line-height: 3vw;
    			background-color: rgb(160, 160, 160);
    			padding:  0 3vw;
    			margin: 1vw 0;
    			color: white;
    			border-radius: 1vw;
    			font-weight: bold;
    			transition: all 1.5s;
    		}
    		#app>.content ul li>a:hover{
    			color: black;
    			letter-spacing: .1vw;
    		}
    		#app>.content ul span{
    			display: inline-block;
    			width: 5vw;
    			height: 5vw;
    			background: rgb(255, 255, 255);
    			background-size: 100%;
    			border-radius: 1vw;
    			margin-right: 1vw;
    		}
    		footer{
    		    background-color: #353d44;
    		    text-align: center;
    		    padding: 3vw 0 1vw 0;
    		    border-radius: .5vw .5vw 0 0;
    		    margin-top: 3vw;
    			position: relative;
    		}
    	    footer p{
    		    /*margin: 5vw 0 0 0;*/
    		    /*padding: 5vw 0;*/
    		    /*display: inline-block;*/
    		    /*display: flex;*/
    		    /*justify-content: center;*/
    		    /*align-items: center;*/
    		}
    		footer .left{
    		    color: #fff;
    		    font-size: 1vw;
    		    margin: 3vw 0 0vw 0;
    		}
    
    		footer>div{
    			display: flex;
    			align-items: center;
    			justify-content: center;
    			position: relative;
    			height: 8vw;
    		}
    		footer>div img{
    			position: absolute;
    			transition: all 1s;
    			left: 0;
    			right: 0;
    			top: 0;
    			bottom: 0;
    			z-index: 2;
    			margin: auto;
    		}
    		footer .emo{
    		    box-sizing: border-box;
    		    padding:  0 2vw;
    		    position: absolute;
    		    width: 100%;
    		    display: flex;
    		    justify-content: space-between;
    		}
    		footer .emo .left,.right{
    		    width: 15vw;
    		    height: 20vw;
    		}
    		/*footer .emo .left{*/
    		    /*background: url('./img/bottom2.gif');*/
    		/*    background-repeat: no-repeat;*/
    		/*    background-size: 100%;*/
    		/*}*/
    		/*footer .emo .right{*/
    		/*    background: url('../img/bottom1.gif');*/
    		/*    background-repeat: no-repeat;*/
    		/*    background-size: 100%;*/
    		/*    background-position-y: bottom;*/
    		/*}*/
    		footer .wechat{
    			position: absolute;
    			display: inline-block;
    			font-weight: bold;
    			font-size: 1.5vw;
    			/* margin-left: .5vw; */
    			color: aliceblue;
    			transition: all 1s;
    			left: 0;
    			right: 0;
    			/* top: 0; */
    			/* bottom: 0; */
    			margin: auto;
    			cursor: pointer;
    			visibility: hidden;
    		}
    		footer .Wx{
    		    height: 5vw;
    		}
    		footer .Wx:hover .wechat{
    			transition: all 1s;
    			left: 12%;
    			/* display: inline-block; */
    			visibility: inherit;
    			text-shadow: .5vw .3vw 1px #9c9c9c;
    		}
    		footer .Wx:hover img{
    			transition: all 1s;
    			right: 12%;
    			box-shadow: -.4vw .3vw 1px 0 #9c9c9c;
    
    		}
    		footer a{
    		    color: #fff;
    		    font-size: 1vw;
    		}
    		/*.bottom .wechat{*/
    		    /*flex: auto;*/
    		    /*margin: auto;*/
    		/*    float: right;*/
    		/*}*/
    		footer img{
    		    width: 8vw;
    		    margin: 0;
    		    padding: 0;
    		}
    		#tag{
    		    position: fixed;
    		    width: 2vw;
    		    background-color: rgba(150,150,150,.6);
    		    border-radius: .5vw;
    		    top: 2vw;
    		    right: 0vw;
    		    z-index: 99;
    		    padding: .5vw .5vw .5vw .5vw;
    		}
    		#tag #windo a{
    		    display: block;
    		    width: 2vw;
    		    height: 2vw;
    			cursor: pointer;
    			/*visibility: hidden;*/
    		    background-image: url('../img/windown.png');
    		    background-size: 100%;
    		}
    		#tag #windo {
    		    width: 100%;
    		    display: block;
    		    cursor: not-allowed;
    		}
    		/*    display: block;*/
    		/*    width: 100%;*/
    		/*    height: 100%;*/
    		/*	cursor: pointer;*/
    		/*	visibility: hidden;*/
    		/*    background-image: url('../img/qr.png');*/
    		/*    background-size: 100%;*/
    		/*}*/
    		#tag p{
    		    margin: 0 auto;
    		    margin-top: .4vw;
    		    width: 100%;
    		    text-align: center;
    		    font-size: .9vw;
    		    font-weight: bold;
    		}
    		#tag p {
                position: relative;
                cursor: pointer;
            }
            
            #tag #phqr::after {
                content: '';
    			transition: all .4s;
                /*position: abvwsolute;*/
                position: absolute;
                display: block;
                visibility: hidden;
                /*display: none;*/
                width: .1vw;  /* 调整为合适的尺寸 */
                height: .1vw; /* 调整为合适的尺寸 */
                top: 0;    /* 显示在p元素下方 */
                right: 2vw;
                background-image: url('../img/qr.png');
                background-size: contain;
                background-repeat: no-repeat;
                z-index: 1;  /* 确保显示在其他元素上方 */
            }
            
            #tag #phqr:hover::after {
                visibility: visible;
                width: 5vw;  /* 调整为合适的尺寸 */
                height: 5vw; /* 调整为合适的尺寸 */
                right: 2.5vw;
                z-index: 10;
    			transition: all .8s;
            }