html {
    color: #000
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
    word-break:break-all;
    font-family: "PingFang SC", "Microsoft YaHei", "HanHei SC", "Helvetica Neue", "Open Sans", Arial, "Hiragino Sans GB",  微软雅黑, STHeiti,  "WenQuanYi Micro Hei", SimSun, sans-serif;
}
button{outline: none;}

*{
    text-decoration: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

fieldset, img {
    border: 0
}

address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
    font-weight: normal
}

ol, ul {
    list-style: none
}

caption, th {
    text-align: left
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight: normal
}

abbr, acronym {
    border: 0;
    font-variant: normal
}

sup {
    vertical-align: text-top
}

sub {
    vertical-align: text-bottom
}

input, textarea, select {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    *font-size: 100%
}

#drogue {
    position: fixed;
    right: 0;
    top: 35%;
    margin:auto;
    display: flex;
    flex-direction: column;
    z-index: 99;
}

#drogue > div:first-child {
    border-radius: 4px 0 0 0;
}

#drogue > div:last-child {
    border-radius: 0 0 0 4px;
}

#drogue > div {
    width: 60px;
    height: 70px;
    background: #666B76;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    z-index: 999;
}

#drogue > div:nth-child(n+2):after{
    content:"";
    position: absolute;
    bottom:0;
    left:5px;
    right:5px;
    height: 1px;
    z-index: 99;
    background: #ffffff;
}

#drogue > div > img {
    width: 26px;
    height: 26px;
    margin-bottom: 5px;
}

#drogue > div > span {
    font-size:12px;
    color:#fff;
}

#drogue > div:hover {
    background: #666B76;
}
#drogue .thanksgiving{
    margin-bottom: 20px;
    background: transparent;
    border: none;
}
#drogue .thanksgiving:hover{
    background: transparent;
}
#drogue .thanksgiving a{
    display: inline-block;
    width: 100%;
    height: 100%;
}
#drogue .thanksgiving a img{
    width: 100%;
    height: 100%;
}
.tel400 .tel400Bg, .weiChat .weiChatg{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 99;
    background: #666B76;
    width: 100%;
    height: 100%;
    border-radius: 4px 0 0 0;
}

.weiChat div.drogueTel{
    display: flex;
    flex-direction: column;
    width: 140px;
    height: 160px;
}

.weiChat .drogueTel > img{
    width: 119px;
    height: 119px;
}

.weiChat .drogueTel .message{
    font-size: 14px;
    text-align: center;
    color: #666B76;
    line-height: 20px;
}

.tel400 .tel400Bg > img, .weiChat .weiChatg > img {
    width: 26px;
    height: 26px;
    margin-bottom: 5px;
}

.tel400 .tel400Bg > span, .weiChat .weiChatg > span {
    font-size:12px;
    color:#fff;
}

.tel400:hover .drogueTel,
.thanksgiving:hover .drogueTel, .weiChat:hover .drogueTel{
    right:75px;
    opacity: 1;
}

.tel400 .drogueTel,
.thanksgiving .drogueTel, .weiChat .drogueTel{
    position: absolute;
    right:-300px;
    top:10px;
    background: #fff;
    box-shadow: 2px 2px 13px rgba(0,0,0,.2);
    width: 180px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #666B76;
    border-radius: 5px;
    transition: all .3s ease-in-out;
    opacity: 0;
    z-index: 98;
}

.tel400 .drogueTel:after,
.thanksgiving .drogueTel:after,.weiChat .drogueTel:after{
    content:"";
    position: absolute;
    right:-20px;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 15px solid transparent;
    border-left: 10px solid #fff;
}
.weiChat .drogueTel:after{
    top: 10px;
}