/**

深圳市国人在线信息技术有限公司

http://www.36099.com

**/

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, figure { margin: 0; padding: 0; }

ol, li, ul, dl, dt, dd { list-style: none; }

fieldset, img, input, select { border: 0; }

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

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

sup { vertical-align: text-top; }

sub { vertical-align: text-bottom; }

img { vertical-align: middle; max-width: 100%; max-height: 100%; }

input, textarea, select, button { font-family: inherit; font-size: inherit; font-weight: inherit; outline-style: none; outline-width: 0pt; resize: none; padding: 0; margin: 0; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

b, em, i { font-style: normal; }

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.clearfix { zoom: 1; }

html { overflow-x: hidden; zoom: 1; overflow-y: scroll; overflow: -moz-scrollbars-vertical; }

body { font-family: "Microsoft Yahei", "微软雅黑", "helvetica", "arial", sans-serif; color: #333; font-size: 12px; background: #ffffff; }

a { color: #333; text-decoration: none; cursor: pointer; }



/*其他*/

.w1600 { margin-right: auto; margin-left: auto; width: 1600px; box-sizing: border-box;}

@media (max-width: 1600px) {

    .w1600 {

        width: 1400px;

    }

}

@media (max-width: 1440px) {

    .w1600 {

        width: 1200px;

    }

}



/* hover效果集合 */



/* 文字背景遮盖效果 */



.hoverText { width: 146px; line-height: 36px; box-sizing: border-box; border: 2px solid#3f3f3f; text-align: center; font-weight: bold; display: inline-block; position: relative; overflow: hidden; font-size: 16px; }

.hoverText span { color: #333333; position: relative; transition: .5s; }

.hoverText:hover span { color: #fff; transition: .5s; }

.hoverText::before { content: ""; position: absolute; left: -100%; top: 0; width: 100%; height: 100%; background: #0078bf; transition: .5s; }

.hoverText:hover { border: 2px solid #0078bf; }

.hoverText:hover.hoverText::before { left: 0; }



/* 高亮的滤镜效果 */

.gaoLiang:hover { filter: brightness(115%); cursor: pointer; }



/* banar图hover效果 */

.banaBox { overflow: hidden; position: relative; }

.banaBox img { cursor: pointer; transition: all 3s; }

.banaBox img:hover { transform: scale(1.1); }



/* 其它图片hover效果 */

.hoverImgBox { overflow: hidden; transition: all 0.5s; }

.hoverImgBox.shadow:hover { -webkit-transform: translate3d(0, -2px, 0); transform: translate3d(0, -2px, 0); box-shadow: 0 10px 20px 0 #ccc; }

.hoverImgBox img { cursor: pointer; transition: all 1s; }

.hoverImgBox:hover img { transform: scale(1.08);    /* filter: brightness(0.9); */ }

img.banar { width: 100%;display: block;}
img.banar.smallBana { width: 100%;display: block;height: 100%;}



/* 轮播图样式 */
div.swiper-container.shouYeBanar{height:697px;}
span.swiper-pagination-bullet { width: 16px; height: 16px; border: 1px solid #dddddd; }

div.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 10px;border-radius: 50%; }

div.swiper-button-prev:hover,div.swiper-button-next:hover{background-color: #0078bf !important;cursor: pointer;}

/* 返回顶部样式 */

.qqkefu { position: fixed; bottom: 50px; z-index: 999; right: 0; width: 40px; }

.qqkefu ul li { height: 48px; margin-bottom: 1px; float: right; background: #999; line-height: 48px; font-size: 14px; cursor: pointer; display: none; position: relative }

.qqkefu ul li:hover { background: #0078bf; }

.qqkefu ul li.top2 { color: #1c1c1c; font-weight: 800; text-align: center; background: #999 url(../images/top.png) no-repeat center; position: relative; width: 53px; cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }

.qqkefu ul li.top2:hover { background-color: #0078bf; }



/* bana图上的文字 */

.banaBox .banaText { position: absolute; left: 11%; top: 32%; color: #333; }

.banaBox .banaText.banaBlackText { left: 68%; color: #fff; text-align: right; top: 40%; }

.banaBox .banaText span { font-size: 48px; }

.banaBox .banaText p { font-size: 28px; margin-top: 15px; }



/* 跳动的文字 */

.num { height: 85px; color: #333333; font-size: 48px; font-weight: bold; }

.num i, .num span { position: relative; height: 85px; line-height: 85px; display: inline-block; z-index: 99; }

.num i::before { width: 20px; height: 3px; content: ''; background-color: #d8d8d8; position: absolute; left: 0; bottom: 0; }
.num.noBefore i::before { content: none; }

.num i::after { width: 52px; height: 52px; border-radius: 26px; background-color: #0078bf; content: ''; position: absolute; right: -26px; top: 0px; z-index: -1; }

.ml10 { margin-left: 10px; }

.mt10 { margin-top: 10px; }

.mt15 { margin-top: 15px; }

.mt40 { margin-top: 40px; }

.mt60 { margin-top: 60px; }



/*------------------------------------------------------------*/



/*媒体查询*/

@media (min-width:1900px) {

    div.header .hederRight, div.footer .footerCenter li a { font-size: 18px; }

}

@media (max-width:1900px) and (min-width:1680px) {

    div.header .hederRight, div.footer .footerCenter li a { font-size: 16px; }

    .header .hederLeft .hederLeftText h1 { font-size: 26px; }

    div.header .hederRight ul li { margin-right: 40px; }

    div.productLayout .productCenter .productLeft .leftList .leftListItem img {
        width: 100px;
        height: 100px;
    }
    div.pageServiceLayout .serviceRight .serviceBottom i{font-size: 30px;}
    div.productLayout .productCenter .productLeft .leftBottom i{font-size: 28px;}
    div.pageServiceLayout .serviceRight .serviceBottom a { width: 120px;}
    div.pageServiceLayout .serviceRight{padding: 70px;}
}



/*------------------------------------------------------------*/

@media (max-width:1680px) and (min-width:1440px) {

    div.paddingLayout { padding: 0 100px; }

    div.header .hederRight { font-size: 15px; }
     div.footer .footerCenter li a { font-size: 15px; }

    div.header .hederLeft .hederLeftText h1, div.footer .footerRight h2 { font-size: 24px; }

    div.header .hederRight ul li { margin-right: 28px; }
    div.productLayout .productCenter .productLeft .leftList .leftListItem img {
        width: 80px;
        height: 80px;
    }
    div.productLayout .productCenter .productLeft .leftBottom i{font-size: 26px;}
    div.pageServiceLayout .serviceRight .serviceBottom i{font-size: 28px;}
    div.pageServiceLayout .serviceRight .serviceBottom a { width: 110px;}
    div.pageServiceLayout .serviceRight{padding: 65px;}
}



/*------------------------------------------------------------*/

@media (max-width:1440px) and (min-width:1360px) {

    div.paddingLayout { padding: 0 50px; }

    div.header .hederRight { font-size: 16px; }
    div.footer .footerCenter li a { font-size: 13px; }
    .showOrHidden{display: none;}

    div.header .hederLeft .hederLeftText h1, div.footer .footerLeft .footerLeftText h3, div.footer .footerRight h2 { font-size: 22px; }

    div.header .hederRight ul li { margin-right: 28px; }
    div.productLayout .productCenter .productLeft .titleTwo{
        line-height: 24px;
    }
    div.productLayout .productCenter .productLeft .leftList .leftListItem img {
        width: 70px;
        height: 70px;
    }
    div.productLayout .productCenter .productLeft .leftBottom i{font-size: 24px;}
    div.pageServiceLayout .serviceRight .serviceBottom i{font-size: 26px;}
    div.pageServiceLayout .serviceRight .serviceBottom a { width: 100px;}
    div.pageServiceLayout .serviceRight{padding: 50px;}
}



/*------------------------------------------------------------*/

@media (max-width:1360px) {

    div.paddingLayout { padding: 0 50px; }

    div.header .hederRight { font-size: 15px; }
    div.footer .footerCenter li a { font-size: 12px; }
    .showOrHidden{display: none;}

    div.header .hederLeft .hederLeftText h1, div.footer .footerLeft .footerLeftText h3, div.footer .footerRight h2 { font-size: 20px; }

    div.header .hederRight ul li { margin-right: 26px; }
    div.productLayout .productCenter .productLeft .leftList .leftListItem img {
        width: 70px;
        height: 70px;
    }
    div.productLayout .productCenter .productLeft .leftBottom i{font-size: 24px;}
    div.pageServiceLayout .serviceRight .serviceBottom i{font-size: 25px;}
    div.pageServiceLayout .serviceRight .serviceBottom span{font-size: 14px;}
    div.pageServiceLayout .serviceRight .serviceBottom a { width: 90px;}
    div.pageServiceLayout .serviceRight{padding: 45px;}
}



/* 留言样式 */



/* 表单点击后的边框颜色 */



input { outline-color: #f6f6f6; -moz-outline-color: #f6f6f6; -ms-outline-color: #f6f6f6; -webkit-outline-color: #f6f6f6; }

textarea { outline-color: #f6f6f6; -moz-outline-color: #f6f6f6; -ms-outline-color: #f6f6f6; -webkit-outline-color: #f6f6f6; }

.guest_box li .textarea { width: 868px; padding-left: 30px; font-size: 12px; height: 230px; border: 1px solid #fff; padding-top: 10px; color: #666; line-height: 20px; background-color: #eee; font-family: 微软雅黑; overflow: auto; display: inline-block; overflow: auto; }

.videobox .guest_box li { margin-top: 30px; width: 48%; margin-bottom: 0px; }

.guest_box .submit { width: 198px; height: 57px; margin: 0 auto; margin-top: 30px; background: none; display: block; color: #0078bf; font-size: 16px; cursor: pointer; transition: 0.3s; border: 1px solid #0078bf; font-family: 微软雅黑; }

.guest_box .submit:hover { color: #fff; background-color: #0078bf; }

.zxly .list_title2 { margin-bottom: 65px; }

.guest_box2 li:nth-of-type(2) { float: right; }

.guest_box2 li { margin-bottom: 15px; display: inline-block; }

.guest_box2 .submit { width: 145px; height: 40px; }

.guest_box2 .input { font-size: 12px; box-sizing: border-box; border: 1px solid #fff; width: 442px; height: 40px; line-height: 40px; padding-left: 30px; color: #666; background: #fff; background-color: #eee; display: inline-block; }



/* 留言弹窗 */

.vwrap { display: none; z-index: 1040; width: 100%; position: fixed; left: 0; top: 0; }

.vwrap .videobtg { z-index: 900; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #000; opacity: 0.7; filter: alpha(opacity=70); overflow: hidden; }

.vwrap .videobox { z-index: 990; padding: 0 50px; width: 900px; height: 500px; background-color: #fff; position: fixed; left: 50%; top: 50%; margin-top: -250px; margin-left: -500px; }

.vwrap .videobox #videobox1 { width: 100%; display: inline-block; height: 100%; background: #000; }

#videobox_wrapper { height: 100% !important; }

.vwrap .close { z-index: 999; width: 24px; height: 24px; cursor: pointer; position: absolute; top: -38px; right: -40px; }

.vwrap .close i { display: block; width: 24px; height: 24px; background: url(../images/close.png) no-repeat 50% 50%; -webkit-transition: 400ms; transition: 400ms; }

.vwrap .close:hover i { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.guest_box.guest_box2 { padding-top: 20px; }



/* 首页顶部样式和底部样式 */



/* 首页顶部样式 */



.header { padding: 0 150px; height: 100px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: center; color: #333333; }

.header .hederLeft { display: flex; justify-content: space-between; align-items: center; }

.header .hederLeft img {  display: block; }

.header .hederLeft .hederLeftText h1 { font-size: 26px; font-weight: bold; }

.header .hederLeft .hederLeftText span { font-size: 14px; line-height: 32px; }

.header .hederRight { display: flex; justify-content: space-between; font-size: 18px; line-height: 32px; }

.header .hederRight ul { display: flex; }

.header .hederRight ul li { margin-right: 45px; position: relative; }

.header .hederRight ul li::before { content: ''; position: absolute; left: -14px; top: 40%; width: 6px; height: 6px; border: 1px solid #ccc; border-radius: 4px; background-color: #fff; }

.header .hederRight ul li.active::before { background-color: #0078bf; border: 1px solid #0078bf; }

.header .hederRight ul li.active a.yijiTitle { color: #0078bf; }

.header .hederRight ul li a.yijiTitle { padding: 20px 0; position: relative; }

.header .hederRight ul li a.yijiTitle::before { width: 0%; height: 4px; background-color: #0078bf; content: ''; position: absolute; bottom: 0; left: 0; transition: all 0.5s; }

.header .hederRight ul li:hover a.yijiTitle::before { width: 100%; }
.header .hederRight ul li:hover .tnavbox {width: 40vw; }

.header .hederRight img { width: 16px; height: 16px; margin-left: 15px; cursor: pointer;vertical-align: -2px; }

.header .hederRight span:hover { color: #0078bf; }

.weChatA { width: 20px; height: 20px; position: relative; }

.weChatA::before { content: ''; width: 100px; height: 100px; background: url(../images/ewm.png) 0 0 no-repeat; background-size: cover; position: absolute; left: -20px; top: 70px; box-shadow: 0 0 10px 0 #ccc; z-index: 99; transition: all 0.5s; height: 0; }

.weChatA:hover.weChatA::before { height: 100px; top: 40px; }

.header .hederRight img.imgWidth32 { width: 32px; height: 32px; }



/* 轮播图样式 */

span.swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #ec7a28; }

span.swiper-pagination-bullet { background-color: #fff; opacity: 1; }



/* 底部样式 */

.footer, .footerTwo { padding: 0 150px; box-sizing: border-box; background-color: #1a1a1a; }

.footer { height: 250px; display: flex; justify-content: space-between; }

.footer .footerLeft { display: flex; margin-top: 50px; }

.footer .footerLeft .footerLeftText h3 { font-size: 23px; color: #ffffff; font-weight: bold; }

.footer .footerLeft .footerLeftText span { font-size: 16px; color: #999999; line-height: 32px; }

.footer .footerLeft img { width: 192px; height:54px; display: block; }

.footer .footerCenter { margin-top: 80px; display: flex; }

.footer .footerCenter li a { color: #ffffff; font-size: 18px; line-height: 32px; padding: 0 20px; }

.footer .footerCenter li a:hover { color: #0078bf; }

.footer .footerRight { color: #ffffff; margin-top: 35px; text-align: right; }

.footer .footerRight span { color: #999999; font-size: 16px; line-height: 32px; }

.footer .footerRight h2 { font-size: 32px; margin-top: 10px; }

.footer .footerRight p { cursor: pointer; font-size: 16px; display: inline-block; width: 196px; line-height: 46px; border-radius: 23px; text-align: center; background-color: #0078bf; color: #ffffff; }

.footer .footerRight p:hover, .footer .footerRight img:hover { filter: brightness(115%); cursor: pointer; }

.footer .footerRight img { width: 48px; height: 48px; border-radius: 26px; margin-left: 10px; }

.footerTwo { height: 83px; border-top: 1px solid #4c4c4c; display: flex;  align-items: center; color: #6f6f6f; }

.footer .footerRight a { color: #6f6f6f; transition: all 0.5s;line-height: 24px; }
.footerTwo a { color: #6f6f6f; transition: all 0.5s;line-height: 22px;}
.footer .footerRight a:hover,.footerTwo a:hover { color: #0078bf; }


.flink {
  margin-top: 50px;
  width: 100%;
}

.flink .flink_tit {
  width: 100%;
  position: relative;
}

.flink .flink_tit p {
  height: 12px;
  width: 100%;
  background: url(../img/dian.png);
  position: absolute;
  top: 15px;
}

.flink .flink_tit span {
  height: 42px;
  background: #fff;
  color: #1C4587;
  font-size: 14px;
  border: 1px solid #1C4587;
  position: relative;
  z-index: 9;
  display: block;
  width: 115px;
  text-align: center;
  line-height: 42px;
  margin-left: 0px;
}

.flink .flink_list {
  width: 100%;
  margin-top: 20px;
  margin-left: 0px;
}

.flink .flink_list ul li {
  float: left;
  margin-right: 28px;
  margin-bottom: 8px;
}

.flink .flink_list ul li a {
  font-size: 12px;
  color: #5a5a5a;
}

.flink .flink_list ul li a:hover {
  color: #036aac;
}

.pro_tag {
    border-top: 1px dashed #999;
    border-bottom: 1px dashed #999;
    line-height: 40px;
    margin-top: 20px;
}

.pro_tag span {
  font-size: 14px;
  color: #333;
}
.pro_tag a {
  font-size: 11px;
  color: #666;
  padding-right: 15px;
}
.pro_tag a:hover {
  color: #036aac;
}
.showarea {
    padding: 15px 0;
}
.showarea h3 {
  padding-bottom: 10px;
  font-size: 16px;
  color: #036aac;
  border-bottom: 1px solid #e4e4e4;
  display: block;
}
.showarea h3 span {
  font-weight: 400;
  color: #999;
  text-transform: uppercase;
}
.showarea .list {
      overflow: hidden;
    margin-top: 20px;
}
.showarea .list a {
    display: block;
    margin-right: 17px;
    font-size: 14px;
    float: left;
    margin-bottom: 12px;
}
.showarea .list a:hover {
  color: #036aac;
}
.clear {
  clear: both;
}


/* 二级导航样式 */

.contentTitle { width: 100%; padding: 0 150px; box-sizing: border-box; background-color: #0078bf; height: 60px; font-size: 16px; }

.fixedLayout { width: 100%; height: 60px; }

.fixed { position: fixed; left: 0; top: 0; z-index: 99; }

.contentTitle .contentTitleLeft { color: #ffffff; line-height: 60px; }

.contentTitle .contentTitleLeft a { color: #ffffff; }

.contentTitle .contentTitleRight { float: right; width: 570px; }

.contentTitle .contentTitleRight ul { display: flex; }

.contentTitle .contentTitleRight ul li { display: inline-block; width: 200px; height: 100%; line-height: 60px; color: #ffffff; text-align: center; cursor: pointer; transition: all 0.5s; }

.contentTitle .contentTitleRight ul li a { display: inline-block; width: 100%; color: #fff; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; }

.contentTitle .contentTitleRight ul li:hover { background-color: #f08519; }

.contentTitle .contentTitleRight ul li.on { background-color: #f08519; filter: brightness(110%); }