﻿/* 悬浮窗 主要css样式*/


.ztl_bar_qq { display: block; width: 106px; height: 116px; font-size: 14px; color: #0484cd; text-align: center; position: relative; }

.ztl_bar_qq span { bottom: 5px; position: absolute; width: 90px; left: 10px; }

.ztl_bar_qq_img { width: 70px; height: 70px; border-radius: 35px; position: absolute; left: 18px; top: 10px; overflow: hidden; z-index: 9; }

.ztl_bar_qq_img .img { width: 70px; height: 80px; background: url(../img/contact/qq.png) no-repeat; }

.ztl_bar_qq_con { z-index: 99; position: absolute; width: 109px; height: 118px; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom: 1px solid #dddddd; background: url(../img/contact/qq-icon-bg.png) no-repeat center 8px; }

.ztl_bar_qq_img img { max-width: 60px; display: block; position: absolute; left: 6px; top: 3px; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }

.ztl_bar_qq:hover .ztl_bar_qq_img img { max-width: 70px; left: 1px; top: 8px; position: absolute; }

.ztl_bar_main { background: #F9FAFB; border: 1px solid #dddddd; border-radius: 10px; background: #F9FAFB; display: none; }

.ztl_bar_tel { color: #000000; text-align: center; width: 109px; height: 105px; border-bottom: 1px solid #dddddd; }

.ztl_bar_tel div { font-weight: bold; font-size: 12px; margin-top: 6px; }

.ztl_bar_tel .tel-num { font-family: Arial; font-weight: bold; color: #e93a3a; }

.ztl_bar_tel:hover { background: #fafafa; }

.ztl_bar_ft { position: relative; }

.ztl_bar_weixin { width: 55px; height: 47px; border-right: 1px solid #dddddd; background: #f5f5f5; border-bottom-left-radius: 10px; background: url(../img/contact/weixing-icon.png) no-repeat center center; float: left; }

.ztl_bar_weixin:hover .ztl_bar_weixin_show { display: block; }

.ztl_bar_weixin_show { display: none; width: 112px; height: 138px; background: #ffffff; border-radius: 10px; border: 1px solid #dddddd; position: absolute; left: -125px; top: -92px; }

.ztl_bar_weixin_sj { width: 0; height: 0; border-style: solid; border-color: transparent transparent transparent #ffffff; border-width: 6px; left: 112px; top: 104px; position: absolute; z-index: 2; }

.ztl_bar_weixin_sj2 { width: 0; height: 0; border-style: solid; border-color: transparent transparent transparent #dddddd; border-width: 8px; left: 112px; top: 102px; position: absolute; }

.ztl_bar_weixin_show img { width: 104px; height: 103px; padding-left: 5px; padding-top: 5px; }

.ztl_bar_weixin_show .txt { position: absolute; top: 110px; left: 7px; width: 100px; margin: 0 auto; text-align: center; }

.ztl_bar_gotop { width: 50px; height: 47px; background: #f5f5f5; border-bottom-right-radius: 10px; background: url(../img/contact/totop-icon.png) no-repeat center center; float: right; }

.ztl_bar_gotop a { display: block; width: 52px; height: 47px; }

.ztl_bar_close { position: absolute; right: 10px; top: -12px; z-index: 100; width: 24px; height: 24px; }

.ztl_bar_close a { display: block; width: 24px; height: 24px; background: url(../img/contact/close_im.png) no-repeat left top; }

.ztl_bar_close a:hover { text-decoration: none; }

.ztl_bar_molie { position: fixed; left: 0; bottom: 7.2%; z-index: 100; width: 100%; height: 42px; line-height: 42px; color: #fff; font-size: 14px; background-color: #e93a3a; }

.ztl_bar_molie .act { float: left; width: 49.99999%; text-align: center; color: inherit; }

.ztl_bar_molie .act .ico { display: inline-block; vertical-align: middle; margin: -2px 0 0 0; width: 22px; height: 22px; background: center no-repeat; -webkit-background-size: 100% auto; background-size: 100% auto; }

.ztl_bar_molie .act .contact { background-image: url(../img/contact/online.png); }

.ztl_bar_molie .act .tel { background-image: url(../img/contact/online.png); }

@media (min-width: 960px) { .ztl_bar_molie { display: none; }
  .ztl_bar { top: 240px; bottom: auto; display: block; }
  .ztl_bar_open { cursor: pointer; display: none; position: absolute; top: 0; right: 0; margin-left: 68px; width: 28px; height: 92px; background: url(../img/contact/open_im.png) no-repeat left top; }
  .ztl_bar_main { display: block; }
  .mod2 .ztl_bar_open { display: block; }
  .mod2 .ztl_bar_main { display: none; } }
@media (min-width: 1367px) { .ztl_bar { top: 230px; height:425px;} }
@media (max-width: 960px){.ztl_bar{display: none; }}

/*底部横幅*/
.num1{color: #fd3235;}
.txtin{color:#666;}
.ui-need-bar{z-index: 100;}
.need-bar-toggle { display: none; }
@media (min-width: 1024px) { .need-bar-toggle { position: fixed; left: -100%; bottom: 100px; width: 110px; display: block; cursor: pointer; } }
@media (min-width: 1280px) { .need-bar-toggle { width: 139px; bottom: 165px; } }

.ui-need-bar { display: none; }
@media (min-width: 1024px) { .ui-need-bar { position: fixed; left: 0; bottom:4%; width: 100%; height: 90px; display: block; background: url(http://fuguang.ufile.ucloud.com.cn/barbg.png); -webkit-transform: translate3D(0, 0, 0); transform: translate3D(0, 0, 0); }
  .ui-need-bar .wrapper { position: relative; }
  .ui-need-bar .close { position: absolute; top: 0; right: 0; width: 30px; height: 30px; line-height: 30px; text-align: center; }
  .ui-need-bar .close i { color: #fff; font-size: 16px; }
  .ui-need-bar .close i:after { content: '\e687'; }
  .ui-need-bar .figure { position: absolute; top: 0; left: 0; height: 90px; }
  .ui-need-bar .cnt { float: right; margin: 25px 30px 0 0; }
  .ui-need-bar .txtin { float: left; width: 100px; margin-left: 5px; height: 32px; padding: 6px 10px; line-height: 20px; border: none; background-color: #fff; }
  .ui-need-bar .tj { float: left; padding: 0 20px; margin-left: 10px; height: 32px; line-height: 32px; color: #fff; border: none; background-color: #ff6837; -webkit-border-radius: 3px; border-radius: 3px; }
  .ui-need-bar .total { font-size: 12px; line-height: 32px; color: #bbb; }
  .ui-need-bar .total .iconfont { display: inline-block; vertical-align: top; height: 1px; line-height: inherit; margin-right: 5px; color: #fd3235; }
  .ui-need-bar .total .num { color: #fd3235; } }
@media (min-width: 1280px) { .ui-need-bar { height: 110px; }
  .ui-need-bar .figure { left: -10px; height: 115px; }
  .ui-need-bar .cnt { margin: 40px 10px 0 0; }
  .ui-need-bar .txtin { width: 150px; height: 36px; padding: 8px 10px; }
  .ui-need-bar .tj { width: 90px; height: 36px; line-height: 36px; } }




