@charset "UTF-8";

@import url("https://at.alicdn.com/t/font_2288124_kzy2hgpv7m.css");

/*菜单*/
.jdc-side {height: fit-content;position: fixed; right: 20px; top: 0; bottom: 0; z-index: 300;margin: auto 0;}
.mod_hang_qrcode { margin-bottom: 5px; position: relative}
.mod_hang_qrcode_btn { display: block; width: 60px; height: 60px; color: #005dab; font-size: 40px; cursor: pointer; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; transition: all .25s ease }
.mod_hang_qrcode_btn { position: relative; text-align: center; background: #fff; -webkit-box-shadow: 0 0 10px 0 rgba(20,34,67,.1); -moz-box-shadow: 0 0 10px 0 rgba(20,34,67,.1); box-shadow: 0 0 10px 0 rgba(20,34,67,.1) }
.mod_hang_qrcode_btn i { display: inline-block; line-height: 60px; font-size: 30px; vertical-align: top;}
.mod_hang_qrcode_btn span {position: absolute;top: 0;left: 0;width: 100%; line-height: 15px; font-size: 14px; vertical-align: top; padding: 15px 0; background-color: #fff; visibility: hidden; }
.mod_hang_qrcode_btn:hover span{visibility: visible;}
.mod_hang_qrcode_btn span .inline{display: block !important; }

/*弹出框*/
.mod_hang_qrcode_show { display: none;position: absolute;top: -60px;right: 60px;padding-right: 10px;}
.mod_hang_qrcode_box {width: 156px; text-align: center; float: left;  background: #fff; -webkit-box-shadow: 0 0 10px 0 rgba(20,34,67,.1); -moz-box-shadow: 0 0 10px 0 rgba(20,34,67,.1); box-shadow: 0 0 10px 0 rgba(20,34,67,.1)}
.mod_hang_qrcode_box:after{ content: ""; display: block; clear: both; }
.mod-qr-tips {height: 45px;}
.mod_hang_qrcode_box_img{padding: 3px; }
.mod-qr-tips img,.mod_hang_qrcode_box_img img{max-width: 100%;}
.mod_hang_qrcode_box > p {line-height: 16px;color: #666; font-size: 12px; text-align: center;margin-top: 0;margin-bottom: 10px;}
.mod_hang_qrcode:hover .mod_hang_qrcode_show { display: block }


.jdc_Follow_qrcode .mod_hang_qrcode_show{top: -80px;}

.jdc_Telephone_qrcode .mod_hang_qrcode_show{top: -20px;}
.jdc_Telephone_qrcode .mod_hang_qrcode_box { width: 220px; }
.jdc_Telephone_qrcode .mod_hang_qrcode_box a{ text-align: left; text-decoration: none; cursor: pointer; display: block }
.jdc_Telephone_qrcode .mod_hang_qrcode_box a:after{ content: ""; display: block; clear: both; }
.jdc_Telephone_qrcode .mod_hang_qrcode_box a:hover { background: #f3f5fb }
.jdc_Telephone_qrcode .icon_box { width: 60px; line-height: 80px; text-align: right; float: left; clear: both }
.jdc_Telephone_qrcode .icon_box i { color: #005dab; font-size: 30px }
.jdc_Telephone_qrcode .text_box { padding-left: 15px; padding-top: 21px; display: table;}
.jdc_Telephone_qrcode .text_box h5 { font-size: 18px; color: #005dab; font-weight: 600; line-height: 24px; margin: 0; cursor: pointer; white-space: nowrap; text-overflow: ellipsis; overflow: hidden }
.jdc_Telephone_qrcode .text_box p { margin-top: 5px; max-height: 36px; overflow: hidden; line-height: 18px; font-size: 12px; color: #666; cursor: pointer }

.jdc_Top_qrcode{height: 60px; margin-bottom: 0; }
.jdc_Top_qrcode .mod_hang_qrcode_btn span {visibility: hidden;}
.jdc_Top_qrcode .mod_hang_qrcode_btn:hover {color: #fff !important;background: #005dab}


@media (min-width: 767px){
    /*长方形*/
    .jdc-side .mod_hang_qrcode_btn{ width: 100px; height: 42px; border-radius: 6px;}
    .jdc-side .mod_hang_qrcode_btn i{font-size: 20px;line-height: 42px;}
    .jdc-side .mod_hang_qrcode_btn span{ width: auto; font-size: 13px; line-height: 42px; padding: 0 5px; background: transparent; position: static; visibility: visible;}
    .jdc-side .mod_hang_qrcode_btn span .inline{display: inline !important; vertical-align: top; }
    .jdc-side .mod_hang_qrcode_show { right: 100px;}
    .jdc-side .jdc_Top_qrcode{height: 42px;}
}