
.s_suspendserv_wrap {
    position: fixed;
    z-index: 9030
}

.s_suspendserv_wrap * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.s_suspendserv_wrap:hover .s_suspendserv_border-dashed {
    display: block
}

.s_suspendserv_wrap .s_suspendserv_border-dashed {
    border: 1px dashed #5874d8;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    display: none;
    height: 100%;
    left: -1px;
    position: absolute;
    top: -1px;
    width: 100%
}

.s_suspendserv_servname {
    word-break: break-all
}

.s_suspendserv_wrap-0,
.s_suspendserv_wrap-1 {
    bottom: 60px;
    right: 49px
}

.s_suspendserv_wrap-2 {
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.s_suspendserv_servitem {
    background-color: #fff;
    cursor: pointer;
    position: relative
}

.s_suspendserv_servitem:before {
    content: "";
    height: 100%;
    left: -16px;
    position: absolute;
    top: 0;
    width: 16px
}

.s_suspendserv_servicon-image {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    height: 22px;
    width: 22px
}

.s_suspendserv_hoverarea {
    background: #fff;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
    box-shadow: 0 0 10px rgba(0, 0, 0, .12);
    color: #333;
    font-size: 14px;
    left: -16px;
    line-height: 24px;
    padding: 15px;
    position: absolute;
    text-align: left;
    top: 50%;
    -webkit-transform: translate(-100%, -50%) scale(0);
    -ms-transform: translate(-100%, -50%) scale(0);
    transform: translate(-100%, -50%) scale(0);
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

.s_suspendserv_hoverarea:after {
    background: #fff;
    content: "";
    -webkit-filter: drop-shadow(2px -2px 1px rgba(0, 0, 0, .05));
    filter: drop-shadow(2px -2px 1px rgba(0, 0, 0, .05));
    height: 8px;
    position: absolute;
    right: 0;
    right: -12px;
    top: 50%;
    -webkit-transform: translate(-100%, -50%) rotate(45deg);
    -ms-transform: translate(-100%, -50%) rotate(45deg);
    transform: translate(-100%, -50%) rotate(45deg);
    width: 8px
}

.s_suspendserv_hoveritem {
    display: inline-block;
    max-width: 182px;
    min-width: 100%;
    width: 182px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    word-break: break-all
}

.s_suspendserv_hoverarea-wx {
    padding: 0;
    text-align: center
}

.s_suspendserv_hoverarea-wx .s_suspendserv_hoveritem {
    max-width: 140px
}

.s_suspendserv_hoverarea-wx .s_suspendserv_hovercontent {
    display: block;
    margin-bottom: 12px;
    padding: 0 15px
}

.s_suspendserv_wximgwrap {
    background-color: #f5f5f5;
    height: 110px;
    margin: 15px 15px 8px;
    width: 110px
}

.s_suspendserv_wximgwrap-nomargin {
    margin: 15px
}

.s_suspendserv_hoverwximg {
    max-height: 100%;
    max-width: 100%
}

.s_suspendserv_wrap-0 {
    background: #fff;
    border: 1px solid #e3e7ec;
    border-radius: 6px
}

.s_suspendserv_wrap-0 .s_suspendserv_servitem {
    border-bottom: 1px solid #e3e7ec;
    color: #666;
    padding: 12px 0 10px;
    text-align: center;
    width: 65px
}

.s_suspendserv_wrap-0 .s_suspendserv_servitem:first-child {
    border-radius: 6px 6px 0 0
}

.s_suspendserv_wrap-0 .s_suspendserv_servitem:last-child {
    border-bottom: none;
    border-radius: 0 0 6px 6px
}

.s_suspendserv_wrap-0 .s_suspendserv_servitem:only-of-type {
    border-radius: 6px
}

.s_suspendserv_wrap-0 .s_suspendserv_servitem:hover .s_suspendserv_hoverarea {
    -webkit-transform: translate(-100%, -50%) scale(1);
    -ms-transform: translate(-100%, -50%) scale(1);
    transform: translate(-100%, -50%) scale(1)
}

.s_suspendserv_wrap-0 .s_suspendserv_servicon {
    font-size: 20px;
    margin-bottom: 5px
}

.s_suspendserv_wrap-0 .s_suspendserv_servname {
    font-size: 12px;
    margin: 0 auto;
    max-width: 48px
}

.s_suspendserv_wrap-0 .s_suspendserv_servicon-image {
    margin: 0 auto 5px
}

.s_suspendserv_wrap-1 .s_suspendserv_servitem {
    background: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
    box-shadow: 0 0 10px rgba(0, 0, 0, .12);
    font-size: 20px;
    height: 42px;
    line-height: 42px;
    margin-top: 10px;
    text-align: center;
    width: 45px
}

.s_suspendserv_wrap-1 .s_suspendserv_servitem:hover .s_suspendserv_hoverarea {
    opacity: 1;
    -webkit-transform: translate(-100%) scale(1);
    -ms-transform: translate(-100%) scale(1);
    transform: translate(-100%) scale(1)
}

.s_suspendserv_wrap-1 .s_suspendserv_servitem>.s_suspendserv_servicon-image {
    left: 50%;
    margin-left: -11px;
    margin-top: -11px;
    position: absolute;
    top: 50%
}

.s_suspendserv_wrap-1 .s_suspendserv_servitem-contact {
    height: auto;
    line-height: normal;
    margin-top: 0;
    padding: 12px 0
}

.s_suspendserv_wrap-1 .s_suspendserv_servitem-contact .s_suspendserv_servname {
    font-size: 14px;
    margin: 0 auto;
    width: 14px
}

.s_suspendserv_wrap-1 .s_suspendserv_servicon {
    display: inline-block
}

.s_suspendserv_wrap-1 .s_suspendserv_hoverarea {
    bottom: 0;
    left: -8px;
    opacity: 0;
    padding: 16px 20px;
    text-align: center;
    top: auto;
    -webkit-transform: translate(-100%) scale(0);
    -ms-transform: translate(-100%) scale(0);
    transform: translate(-100%) scale(0);
    -webkit-transition: opacity .3s;
    transition: opacity .3s
}

.s_suspendserv_wrap-1 .s_suspendserv_hoverarea:after {
    display: none
}

.s_suspendserv_wrap-1 .s_suspendserv_hoverarea .s_suspendserv_servicon {
    color: #666;
    font-size: 20px;
    margin-right: 3px
}

.s_suspendserv_wrap-1 .s_suspendserv_hoverarea .s_suspendserv_servicon-image {
    vertical-align: top
}

.s_suspendserv_wrap-1 .s_suspendserv_hoveritem {
    margin-bottom: 13px;
    text-align: center
}

.s_suspendserv_wrap-1 .s_suspendserv_hoveritem:last-child {
    margin-bottom: 0
}

.s_suspendserv_wrap-1 .s_suspendserv_hovername {
    color: #333;
    font-size: 14px;
    vertical-align: text-bottom
}

.s_suspendserv_wrap-1 .s_suspendserv_hoverarea-wx .s_suspendserv_hovername {
    display: block
}

.s_suspendserv_wrap-1 .s_suspendserv_hoverarea-wx .s_suspendserv_hovercontent,
.s_suspendserv_wrap-1 .s_suspendserv_hoverarea-wx .s_suspendserv_hovername {
    max-width: 112px
}

.s_suspendserv_wrap-1 .s_suspendserv_hovercontent {
    color: #999;
    display: block;
    font-size: 12px
}

.s_suspendserv_wrap-2 {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
    box-shadow: 0 0 10px rgba(0, 0, 0, .12)
}

.s_suspendserv_wrap-2 .s_suspendserv_list {
    width: 46px
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem {
    border-bottom: 1px dashed hsla(0, 0%, 100%, .3);
    color: #fff;
    display: inline-block;
    height: 48px;
    left: 0;
    padding: 13px 0;
    position: relative;
    text-align: center;
    -webkit-transition: -webkit-transform .3s ease 0s;
    transition: -webkit-transform .3s ease 0s;
    transition: transform .3s ease 0s;
    transition: transform .3s ease 0s, -webkit-transform .3s ease 0s;
    white-space: nowrap
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:first-child {
    border-radius: 4px 4px 0 0
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:first-child:hover {
    border-radius: 4px 4px 0 4px
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:last-child {
    border-bottom: none;
    border-radius: 0 0 4px 4px
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:last-child:hover {
    border-radius: 4px 0 4px 4px
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:only-of-type {
    border-radius: 4px
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:hover {
    border: none;
    border-radius: 4px 0 0 4px;
    -webkit-transform: translateX(calc(-100% + 46px));
    -ms-transform: translateX(calc(-100% + 46px));
    transform: translateX(calc(-100% + 46px))
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:hover .s_suspendserv_servname {
    display: inline-block
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem:hover .s_suspendserv_servicon {
    margin: 0 8px 0 12px
}

.s_suspendserv_wrap-2 .s_suspendserv_servitem .s_suspendserv_hoverarea-active {
    opacity: 1;
    pointer-events: all
}

.s_suspendserv_wrap-2 .s_suspendserv_hoverarea {
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translate(-100%, -50%);
    -ms-transform: translate(-100%, -50%);
    transform: translate(-100%, -50%);
    -webkit-transition: opacity .3s;
    transition: opacity .3s
}

.s_suspendserv_wrap-2 .s_suspendserv_servicon {
    display: inline-block;
    font-size: 20px;
    margin: 0 13px;
    vertical-align: middle
}

.s_suspendserv_wrap-2 .s_suspendserv_servname {
    display: none;
    margin-right: 12px;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
    width: 84px
}

.s_suspendserv_wrap-2 .s_suspendserv_hovercontent {
    display: block;
    white-space: normal
}
