.header{
    height: 2rem;
    background: #FFFFFF;
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 10;
    box-shadow: 0 .0667rem .0667rem rgba(0, 0, 0, 0.05);
}

.header a img{
    width: 6rem;
    height: 2rem;
}

.header .r{
    display: flex;
    align-items: center;
}

.header .r .button{
    width: 3.4rem;
    height: 1.6rem;
    background: linear-gradient(45deg, #2FA8E1, #0E6EB8);
    border-radius: .08rem;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0.8rem;
}

.header .r img{
    width: 1rem;
    height: 1rem;
    margin-left: 1.2rem;
}

.menu{
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    z-index: 10;
    display: none;
    overflow: auto;
}

.menu-wrap{
    width: 100%;
    min-height: calc( 100% - 2rem );
    overflow-y: hidden;
    /* background: #ccc; */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
}

.menu .nav{
    color: #111111;
    padding: 0 .5333rem;
    margin-top: 2rem;
}

.menu .line{
    width: 100%;
    height: 1px;
    background: #DDDDDD;
    transform: scaleY(0.5);
    margin: .8rem 0;
}

.menu .nav .title, .menu .nav .title a{
    font-size: .8533rem;
    margin-bottom: .4rem;
    color: #111111;
}

.menu .nav a{
    color: #717378;
    font-size: .4267rem;
    display: block;
    line-height: .7467rem;
}

.buttons{
    width: 8.9333rem;
    overflow: hidden;
    margin: 0 auto;
    padding-bottom: .2667rem;
    margin-top: 1.3333rem;
}

.buttons a{
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto .5333rem;
    height: 1.3333rem;
    background: #FFFFFF;
    border: 1px solid #2FA8E1;
    border-radius: .08rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #2FA8E1;
    font-size: .48rem;
}

.buttons a.active{
    background: #2FA8E1;
    color: #fff;
}


.footer{
    overflow: hidden;
    background: #0B0F14;
}

.link{
    padding: 0 .5333rem;
    margin-bottom: 1.6rem;
    display: flex;
    justify-content: space-between;
    overflow: hidden;
}

.link .item a{
    display: block;
    font-size: .3733rem;
    color: #717378;
    line-height: .7467rem;
}

.link .item a.b{
    color: #EDEEF0;
    font-size: .4267rem;
    margin-bottom: .44rem;
    line-height: .4267rem;
    margin-top: 1.2rem;
}

.address img, .address a{
    width: 3.3333rem;
    height: 1.1867rem;
    display: block;
    margin: 0 auto .8rem;
}


.address p{
    font-size: .3733rem;
    text-align: center;
    margin-bottom: .4rem;
}

.address p span{
    color: #717378;
}

.hezuo{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1.2rem;
}

.hezuo img.facebook{
    width: .2933rem;
    height: .5333rem;
}

.hezuo img.ig{
    width: .48rem;
    height: .48rem;
    margin: 0 .8rem;
}

.hezuo img.youtube{
    width: .5333rem;
    height: .4rem;
}


.qr{
    display: flex;
    align-items: center;
    justify-content: center;
}

.qr .item{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 .3067rem;
}

.qr .item .img{
/*    width: 2.6rem;
    height: 2.6rem;*/
}

.qr .item p{
    font-size: .3733rem;
    margin-top: .4rem;
    
}

.logos{
    padding: 1.6rem .56rem .7067rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logos img{
    width: 1.2rem;
    height: 1.2rem;
}

.coryright{
    border-top: 1px #292E33 solid;
    font-size: .32rem;
    padding: .4rem 0;
    text-align: center;
    color: #717378;
    line-height: .4533rem;
}

.coryright a{
    color: #717378;
}

.btn-list{
    display: flex;
    justify-content: center;
    padding: 0 1rem;
}

.button{
    width: 3.7333rem;
    height: 1.28rem;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: .08rem;
    box-sizing: border-box;
    font-size: .4267rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.85);
}

.button.active{
    border: none;
    background: linear-gradient(45deg, #2fe1a5, #0eb889);
}

.b-title{
    font-size: .96rem;
    color:#0B0F14;
    font-family: MSYH-BOLD;
    margin-bottom: .5333rem;
}

.p{
    font-size: .3733rem;
    color: #666;
    line-height: .5333rem;
    text-align: justify;
}
[tooltip]{
    position: relative;
    display:inline-block;
    /*            margin: 20px;
                border: 1px solid #ccc;
                padding: 4px 6px;*/
}
[tooltip]::before {
    content: "";
    position: absolute;
    border-width: 4px 6px 0 6px;
    border-style: solid;
    border-color: transparent;
    border-top-color: #ff5722;
    z-index: 99;
    opacity:0;

    top:-5px;
    left:50%;
    transform: translateX(-50%);
}
[tooltip]::after {
    content: attr(tooltip);
    position: absolute;
    line-height: 30px;
    font-size: 14px;
    background: #ff5722;
    text-align: center;
    color: #fff;
    border-radius: 15px;
    /*padding:4px 2px;*/
    min-width: 120px;
    pointer-events: none;
    z-index:99;
    opacity:0;

    left:50%;
    top:-5px;
    transform: translateX(-50%)   translateY(-100%);
}

[tooltip]::after,[tooltip]::before{
    opacity: 1;
}

[tooltip][position='bottom']::before{
    top: 100%;
    left:50%;
    margin-top: 1px;
    transform: translatex(-50%) rotate(180deg);
}
[tooltip][position='bottom']::after{
    top: 100%;
    left: 50%;
    margin-top: 5px;
    transform: translatex(-50%) ;
}