/* reset */ * {-ms-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;-webkit-tap-highlight-color:transparent;} body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, figure, nav, footer, header, dl, dt, dd, ul, ol, li, fieldset, lengend, button, input, textarea, th, td, tr, pre {margin: 0;} ul, ol, menu, td {padding: 0;} ul, ol ,li{list-style: none;} address, cite, dfn, em, var {font-style: normal;} a {text-decoration: none;color: black;} i{font-style: normal;} a,a:hover{ color:#333} .clearFloat {zoom: 1;} .clearFloat:after {content: '';display: block;clear: both;} img {max-width: 100%;max-height: 100%; border: none;} button{outline: none;background-color: transparent;border: none;padding: 0;margin: 0;cursor: pointer;} input,select{outline: none;background-color: transparent;} textarea{outline: none;} form{margin: 0;padding: 0;} @font-face {font-family: 'iconfont-drop-down';src: url('../fonts/iconfont-drop-down.ttf') format('truetype');} /* header */ .header {width: 100%;height: 60px;background-color: #FFF;position: fixed;top: 0;z-index: 9999;} .header .header-content {width: 1200px;height: 100%;margin: 0 auto;font-size: 14px;} #consoler{margin-right: 30px;} #consoler:hover{color: #2872D9;} .header .header-right .login{width: 80px;height: 35px;line-height: 35px;font-size: 14px;color: #FFF;text-align: center;letter-spacing: 1px;background-color: #2872D9;border-radius: 20px;cursor: pointer;} .header .header-right .generalize{width: 90px;height: 30px;background: #2872D9;border-radius: 15px;text-align: center;line-height: 30px;color: #fff;cursor: pointer;} .header .header-right .generalize:hover{background-color: #62A4FF;} .header .logo {height: 37px;} .header .logo-black {display: none;} .header .header-center {max-width: 1200px;height: 100%;margin-left: 50px;} .header .header-nav li {margin-right: 28px;position: relative;} .header .header-nav li:last-of-type {margin-right: 0px;} .header .header-nav li > a,.header .header-nav li > span {display: block;height: 20px;line-height: 20px;color: #1d2843;position: relative;} .header .header-nav li > span {cursor: pointer;margin-right: 24px;} .header .header-nav li.active > a,.header .header-nav li.active > span {color: #2872D9;} .header .header-nav li.active > a::before,.header .header-nav li.active > span::before{content: "";display: block;width: 100%;height: 3px;background: #2872D9;border-radius: 8px;margin: 0 auto;position: absolute;bottom: -11px;} .header .header-nav li > span::after {content: "\e62d";font-family: "iconfont-drop-down" !important;font-size: 14px;font-style: normal;font-weight: 600;color: inherit;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-webkit-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: transform 100ms linear;transition: transform 100ms linear;padding: 0 5px;position: absolute;top: 1px;} .header .header-nav li:hover > span::after {-webkit-transform: rotate(180deg);transform: rotate(180deg);} .header .second-list-container {display: none;/* width: 122px;height: 144px; */position: absolute;padding-top: 8px;left: -25px;} .header .second-list-container.row-2 {left: -115px;} .header .nav-second-list {text-align: left;background-color: #fff;border-top: 3px solid #2872D9;padding: 1px 20px 5px;} .header .header-nav li:hover > span + .second-list-container {display: block;} .header .nav-second-list a, .header .nav-second-list > div {display: block;white-space: nowrap;margin: 12px 0;cursor: pointer;} .header .nav-second-list img {display: inline-block;vertical-align: middle;width: 28px;height: 28px;} .header .nav-second-list i {display: inline-block;vertical-align: middle;width: 28px;height: 28px;background-image: url(../img/menu-icons.png);background-repeat: no-repeat;background-size: auto 28px;background-position-y: center;margin-right: 9px;} .header .nav-second-list span {display: inline-block;vertical-align: middle;font-size: 14px;color: #111F3B;} .header .nav-second-list a:hover span, .header .nav-second-list > div:hover span {color: #2872D9;} .header-nav span a:hover{color: #2872D9 !important;} .header .nav-second-list > div {cursor: pointer;position: relative;} .header .nav-second-list > div .tips-bar {display: none;width: fit-content;height: 46px;line-height: 26px;font-size: 16px;color: #1D2843;background-color: #fff;white-space: nowrap;border: 1px solid #DEE4F5;border-radius: 6px;padding: 10px 6px 10px 10px;position: absolute;right: -246px;top: -8px;} .header .nav-second-list > div .tips-bar::before {content: "";width: 9px;height: 9px;background-color: #fff;border: 2px solid #DEE4F5;border-top: none;border-right: none;transform: rotate(45deg);position: absolute;left: -7px;top: 16px;} .header .nav-second-list > div.active .tips-bar {display: block;} .header.light,.header:hover {background-color: #fff;} .header.light .logo-white,.header:hover .logo-white {display: none;} .header.light .logo-black,.header:hover .logo-black {display: block;} .header.light .header-nav li > a,.header.light .header-nav li > span,.header:hover .header-nav li > a,.header:hover .header-nav li > span {color: #1D2843;} .header .header-nav li:hover > a,.header .header-nav li:hover > span {color: #2872D9;} .header-tips {display: none;min-width: 220px;max-width: 500px;font-size: 0;background-color: #E6F6FF;border: 1px solid #92D5FF;border-radius: 4px;padding: 10px 16px 10px 45px;-webkit-transform: translateX(-50%);transform: translateX(-50%);position: fixed;top: 61px;left: 50%;z-index: 9999;} .header-tips::before {content: "i";display: inline-block;width: 22px;height: 22px;line-height: 23px;font-family: Microsoft YaHei;font-size: 14px;font-style: normal;color: #fff;text-align: center;background-color: #2872D9;border-radius: 50%;position: absolute;left: 12px;top: 0;bottom: 0;margin: auto;} .header-tips > span {display: inline-block;vertical-align: middle;line-height: 22px;font-size: 16px;color: #333;white-space: normal;} .icon-crown {width: 10px;height: 10px;top: 0px;right: 0px;background-size: auto 20px;background: red;border-radius: 50%;} .userInfo {width: 120px;height: 60px;position: relative;cursor: pointer;display: none;margin-right: 25px;} .userInfo-info {width: 124px;height: 60px;} .userInfo img {display: block;width: 40px;height: 40px;border-radius: 50%;} .userInfo .user-name {display: block;font-size: 12px;padding-left: 6px;font-weight: 400;color: #253E7B;line-height: 17px;width: 76px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .userInfo .user-type i {width:0;height:0;border-top:6px solid #5F9BBC;border-right:4px solid transparent;border-left:4px solid transparent;margin-left: 3px;margin-top: 1px;} .userInfo .user-type span {font-size: 12px;font-weight: 400;color: inherit;text-align: center;} .userInfo .user-type {width: 76px;height: 20px;background-color: #DEEDF5;border-radius: 10px;color: #5F9BBC;font-size: 12px;padding: 0 2px 0 2px;} /* 用户信息 */ header .pull-down-menu {position: absolute;width: 140px;top: 60px;left: 0px;display: none;border-top: 3px solid #2872D9;} header .userInfo .pull-down-menu ul {width: 100%;background: rgba(255, 255, 255, 1);box-shadow: 0px 0px 5px 0px rgba(146, 146, 146, 0.5);} header .userInfo .pull-down-menu ul .user-tool-list {padding: 7px 0px 6px;} header .userInfo .pull-down-menu ul .pull-down-menu-li {height: 40px;padding: 0;color: #4D4D4D;font-size: 14px;} header .userInfo .pull-down-menu ul .pull-down-menu-li span {color: #b5b5b5;font-size: 12px;text-align: center;display: block;} header .userInfo .pull-down-menu ul .pull-down-menu-li p {text-align: center;line-height: 40px;color: #1d2843;} header .userInfo .pull-down-menu ul .pull-down-menu-li p:hover{color: #2872D9;} header .userInfo .pull-down-menu ul .pull-down-menu-li p i {color: rgb(255, 55, 112);font-style: inherit;} header .userInfo .pull-down-menu ul .pull-down-menu-li p.name {line-height: 20px;padding-top: 8px;} header .userInfo .pull-down-menu ul .user-logout {border-top: 1px solid #EDEDEE;padding: 6px 0;} .header .userInfo .col-gray {color: #b5b5b5;font-size: 12px;cursor: pointer;} .header .userInfo .col-gray:hover {color: #276EF7;} .position-absolute{position: absolute;} .position-relative{position: relative;} /* footer */ .footer {width: 100%;background-color: #263B6F;} .footer .valid-footer {width: 1200px;margin-left: auto;margin-right: auto;} .footer .footer-1 {width: 100%;} .footer .footer-1-container {background-image: url(../img/index-list26.png);background-size: 1054px 129px;background-repeat: no-repeat;background-position: 74px bottom;padding-top: 64px;padding-bottom: 14px;} .footer .footer-1-left {padding-top: .1px;} .footer .footer-logo {height: 70px;margin-top: 24px;} .footer .qr-list {margin-right: 80px;} .footer .qr-list li + li {margin-left: 50px;} .footer .qr-list li img {width: 90px;} .footer .qr-list li p {height: 17px;line-height: 17px;font-size: 12px;color: #8A889A;text-align: center;margin-top: 7px;} .footer .company-info {padding-top: 10px;} .footer .company-info li {font-size: 0;} .footer .company-info li + li {margin-top: 12px;} .footer .company-info li img {display: inline-block;vertical-align: middle;width: 15px;height: 15px;} .footer .company-info li span {display: inline-block;vertical-align: middle;height: 15px;line-height: 15px;font-size: 12px;color: #C5CEDB;margin-left: 9px;} .footer .company-info li span.company-headquarters {font-size: 14px;color: #C5CEDB;margin-left: 0;} .footer .footer-2 {height: 36px;border-top: 1px solid #2C4686;} .footer .footer-2-container {height: 100%;} .footer .friend-link {height: 100%;} .footer .f-link-title {line-height: 1;font-size: 12px;color: #FFF;margin-right: 17px;margin-top: 3px;} .footer .f-link-list a {font-size: 12px;color: #C5CEDB;margin: 0 12px;font-weight: 400;} .footer .f-link-list a:hover {color:#62A4FF;} .footer .footer-3 {height: 50px;background-color: #263762;border-top: 1px solid #2C4686;} .footer .footer-3-container {height: 100%;} .footer .copyright-info {font-size: 12px;color: #8A889A;text-align: center;} .footer .copyright-info a {color: inherit;} .footer .copyright-info .icon-gonganbei {height: 16px;display: inline-block;vertical-align: middle;position: relative;top: -1px;} .footer-2 p,.footer-3 p{ margin: 0;} .footer .footer-right li + li {margin-left: 30px;} .footer .footer-right li img {display: block;width: 106px;height: 106px;margin: 0 auto;} .footer .footer-right li p {line-height: 17px;font-size: 12px;color: #fff;text-align: center;margin-top: 9px;} /* right fixed */ .right-fixed {width: 62px;position: fixed;right: 22px;bottom: 20%;z-index: 199;} .right-fixed .right-tool {padding: 0.1px;} .right-fixed .right-tool li {width: 62px;height: 62px;background-color: #F5F8FF;border: 2px solid #91BDFF;border-radius: 5px;padding-top: 3px;position: relative;} .right-fixed .right-tool li + li {margin-top: 10px;} .right-fixed .right-tool li:hover {background-color: #FEFEFE;border-color: #2872D9;cursor: pointer;-webkit-box-shadow: 0px 2px 5px 1px rgba(56,137,255,0.16);box-shadow: 0px 2px 5px 1px rgba(56,137,255,0.16);} .right-fixed .right-tool li .tool-icon {display: block;width: 36px;height: 36px;background-repeat: no-repeat;background-size: 100% 100%;background-position: center;margin: 0 auto;} .right-fixed .right-tool li.service .tool-icon {background-image: url(../img/kefu.png);} .right-fixed .right-tool li.offiaccount .tool-icon {background-image: url(../img/wx.png);} .right-fixed .right-tool li.telephone .tool-icon {background-image: url(../img/phone.png);} .right-fixed .right-tool li .tool-name {height: 17px;line-height: 17px;font-size: 12px;font-weight: 400;color: #2872D9;text-align: center;} .right-fixed .right-tool li.back-top {width: 31px;height: 40px;background-color: transparent;border: none;border-radius: 0;padding: 0;margin: 20px auto 0;cursor: pointer;} .right-fixed .right-tool li.back-top:hover {background-color: transparent;border-color: transparent;-webkit-box-shadow: none;box-shadow: none;} .right-fixed .right-tool li.back-top.hidden {display: block;opacity: 0;visibility: hidden;} .right-fixed .right-tool li.back-top .tool-icon {width: 100%;height: 100%;background-image: url(../img/dingbu.png);background-repeat: no-repeat;background-size: 100% 100%;} .right-fixed .right-tool li .tool-item {display: none;padding-right: 22px;-webkit-transform: translateY(-50%);transform: translateY(-50%);position: absolute;right: 60px;top: 50%;z-index: 201;} .right-fixed .right-tool li:hover .tool-item {display: block;} .right-fixed .right-tool li .tool-item-content {width: 156px;height: 183px;text-align: center;background-color: #fff;border-radius: 4px;-webkit-box-shadow: 0px 0px 10px 1px rgba(62,114,210,0.16);box-shadow: 0px 0px 10px 1px rgba(62,114,210,0.16);padding-top: 8px;position: relative;} .right-fixed .right-tool li.telephone .tool-item-content {padding-top: 10px;height: 64px;} .right-fixed .right-tool li .tool-item-content::before {content: "";border-top: 12px solid transparent;border-right: 0px solid transparent;border-bottom: 12px solid transparent;border-left: 16px solid #fff;-webkit-transform: translateY(-50%);transform: translateY(-50%);position: absolute;right: -10px;top: 50%;z-index: 200;} .right-fixed .right-tool li .tool-item-content > img {display: block;width: 140px;height: 140px;margin: 0 auto;} .right-fixed .right-tool li .tool-item-content > p {height: 20px;line-height: 20px;font-size: 14px;color: #1D2843;margin-top: 4px;} .right-fixed .right-tool li.telephone .tool-item-content .telephone-title {height: 22px;line-height: 22px;font-size: 16px;font-weight: 400;color: #1D2843;margin: 0;} .right-fixed .right-tool li.telephone .tool-item-content .telephone-number {height: 20px;line-height: 20px;font-size: 16px;font-weight: 400;color: #2872D9;margin-top: 4px;} .right-fixed .right-tool li.telephone .tool-item-content .telephone-number > a {color: inherit;} .d-flex {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;} .flex-row {-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;} .flex-row-reverse {-webkit-box-orient: horizontal;-webkit-box-direction: reverse;-ms-flex-direction: row-reverse;flex-direction: row-reverse;} .flex-column {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;} .flex-column-reverse {-webkit-box-orient: vertical;-webkit-box-direction: reverse;-ms-flex-direction: column-reverse;flex-direction: column-reverse;} .flex-wrap {-ms-flex-wrap: wrap;-webkit-flex-wrap: wrap;flex-wrap: wrap;} .flex-no-wrap {-ms-flex-wrap: nowrap;-webkit-flex-wrap: nowrap;flex-wrap: nowrap;} .justify-content-start {-webkit-box-pack: start;-ms-flex-pack: start;-webkit-justify-content: flex-start;justify-content: flex-start;} .justify-content-center {-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;} .justify-content-end {-webkit-box-pack: end;-webkit-justify-content: flex-end;-ms-flex-pack: end;justify-content: flex-end} .justify-content-between {-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;} .justify-content-around {-ms-flex-pack: distribute;-webkit-justify-content: space-around;justify-content: space-around;} .justify-content-evenly{-webkit-box-pack: justify;-webkit-justify-content: space-evenly;-ms-flex-pack: justify;justify-content: space-evenly;} .align-items-start {-webkit-box-align: start;-ms-flex-align: start;-webkit-align-items: flex-start;align-items: flex-start;} .align-items-center {-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;} .align-items-end {-webkit-box-align: end;-ms-flex-align: end;-webkit-align-items: flex-end;align-items: flex-end;} .align-items-baseline {-webkit-box-align: baseline;-ms-flex-align: baseline;-webkit-align-items: baseline;align-items: baseline;} .align-items-stretch {-webkit-box-align: stretch;-ms-flex-align: stretch;-webkit-align-items: stretch;align-items: stretch;} .align-content-start {-ms-flex-line-pack: start;-webkit-align-content: flex-start;align-content: flex-start;} .align-content-center {-ms-flex-line-pack: center;-webkit-align-content: center;align-content: center;} .align-content-end {-ms-flex-line-pack: end;-webkit-align-content: flex-end;align-content: flex-end;} .align-content-between {-ms-flex-line-pack: justify;-webkit-align-content: space-between;align-content: space-between;} .align-content-around {-ms-flex-line-pack: distribute;-webkit-align-content: space-around;align-content: space-around;} .align-content-stretch {-ms-flex-line-pack: stretch;-webkit-align-content: stretch;align-content: stretch;} .align-self-auto {-ms-flex-item-align: auto;-webkit-align-self: auto;align-self: auto;} .align-self-start {-ms-flex-item-align: start;-webkit-align-self: flex-start;align-self: flex-start;} .align-self-center {-ms-flex-item-align: center;-webkit-align-self: center;align-self: center;} .align-self-end {-ms-flex-item-align: end;-webkit-align-self: flex-end;align-self: flex-end;} .align-self-baseline {-ms-flex-item-align: baseline;-webkit-align-self: baseline;align-self: baseline;} .align-self-stretch {-ms-flex-item-align: stretch;-webkit-align-self: stretch;align-self: stretch;} .flex-1 {-webkit-box-flex: 1;-ms-flex: 1;-webkit-flex: 1;flex: 1;} .auto{margin: 0 auto;} .banner {min-width: 1200px;width: 100%;position: relative;z-index: 2;} .banner-content {width: 1200px;margin: 0 auto;padding-top: 60px;position: relative;} .banner-content .banner-left{height: 380px;z-index: 99;} .banner-content .banner-left p{font-size: 36px;color: #1D2843;font-weight: 500;margin-top: 58px;} .banner-content .banner-left span{font-size: 20px;color: #585E6C;margin-top: 10px;} .banner-content .banner-left .list{width: 310px;margin-top: 28px;} .banner-content .banner-left .list img{width: 25px;height: 25px;} .banner-content .banner-left .list span{color: #253E7B;padding-left: 6px;font-size: 16px;margin-top:0;} .generalizeBtn{width: 180px;height: 46px;background: #2872D9;border-radius: 4px;color: #FFF;text-align: center;line-height: 46px;cursor: pointer;margin-top: 43px;} .generalizeBtner{width: 160px;height: 40px;background: #2872D9;border-radius: 4px;color: #FFF;text-align: center;line-height: 40px;cursor: pointer;} .generalizeBtn:hover{background-color: #62A4FF;} .generalizeBtner:hover{background-color: #62A4FF;} .banner-content .banner-right{position: absolute;width: 1560px;background-repeat: no-repeat;background-size: 103% 100%;right: -200px;top: 0;} .banner-bottom{width: 100%;height: 68px;background: #EFF7FE;position: relative;margin-top: -68px;z-index: 99;} .banner-bottom .itemList{width: 1200px;margin: 0 auto;height: 100%;/* flex-wrap: nowrap; */} .banner-bottom .itemList li img{width: 40px;height: 40px;} .banner-bottom .itemList li .rightBox{margin-left: 3px;} .banner-bottom .itemList li .rightBox p{color: #1D2843;font-weight: 500;font-size: 14px;} .banner-bottom .itemList li .rightBox span{color: #585E6C;font-size: 12px;margin-top: 3px;} .titleBox8{width: 100%;height: 216px;background-image: url(../img/index-list5.png);background-size: 100% 100%;} .titleBox8 .autoBox{width: 1200px;margin: 0 auto;} .titleBox8 .autoBox p{font-size: 28px;color: #1D2843;text-align: center;padding: 60px 0 30px 0;} .titleBox8 .autoBox .loginTry{width: 160px;height: 40px;background: #2872D9;border-radius: 4px;text-align: center;line-height: 40px;color: #FFF;margin: 0 auto;cursor: pointer;} .titleBox8 .autoBox .loginTry:hover{background-color: #62A4FF;} .tabTag{width: 30px;height: 3px;background: #2872D9;border-radius: 8px;margin: 0 auto;position: relative;top: 4px;} .section-promote-now{width: 100%;height: 250px;background-color: #eceffe;background-image: url(../img/promote-now-bg.png);background-repeat: no-repeat;background-size: auto 100%;background-position: center top;} .section-promote-now .autoBox{width: 1200px;height: 100%;margin: 0 auto;} .section-promote-now .autoBox .left {padding-top: 59px;} .section-promote-now .autoBox .left p{color: #1D2843;font-weight: 400;font-size: 22px;} .section-promote-now .autoBox .left .normal-use-btn {margin: 35px auto 0;} .section-promote-now .autoBox .left p:nth-child(2){margin: 14px 0 0;text-align: center;} .section-promote-now .autoBox .right {height: 100%;} .section-promote-now .autoBox .right img{display: block;width: 324px;height: 206px;} .section-container {width: 1200px;padding-top: 30px;margin: 0 auto;} .section-title {line-height: 40px;font-size: 28px;font-weight: 600;color: #1D2843;text-align: center;} .section-sub-title {line-height: 22px;font-size: 16px;font-weight: 400;color: #1D2843;text-align: center;margin-top: 15px;} .dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus,.dropdown-menu>li>a:hover,.dropdown-menu>li>a:hover,.dropdown-menu>li>a:hover,.dropdown-menu>li>a:active,.dropdown-menu>li>a:hover,.dropdown-menu>li>a.active {background-color: rgba(255, 100, 50, 0.05)} .navbar .btn-primary-blank,.navbar .btn-primary-blank:hover,.navbar .btn-primary-blank:focus,.navbar .btn-primary-blank.active,.navbar .btn-primary-blank:active:hover,.navbar .btn-primary-blank.active.focus {color: #007bff;background-color: transparent;border-color: #007bff} .navbar-index .navbar-right .navbar-nav-menu>li>a .icon-demonstrate {color: #ff5f44} /*banner*/ .gallery-container {height: 400px;position: relative} .gallery-container .gallery-swiper {height: 100%;width: 100%} .gallery-container .gallery-swiper a {margin: 0 auto;display: block;width: 100%;height: 100%;position: relative} .gallery-container .gallery-swiper img {position: relative;top: 0;left: 50%;transform: translateX(-50%);max-width: none!important;height: 100%} .gallery-container .gallery-swiper .swiper-pagination {z-index: 3} .gallery-container .gallery-swiper .banner-pagination-bullet {margin: 0 4px;width: 36px;height: 4px;display: inline-block;background-color: rgba(0, 0, 0, 0.55)} .gallery-container .gallery-swiper .banner-pagination-bullet-active {background-color: #007bff} /*goneneng*/ .tabs ul li {float: left; } #menu{ height: 60px; border-bottom: 1px solid #d1d1d2; padding: 0 170px;} #menu li {text-align: center;float: left;width: 110px; height: 60px; line-height: 60px; margin: 0 30px; cursor: pointer;} #menu li.tabFocus { border-bottom: 3px solid #0f50e0;z-index: 100;position: relative;} #content {width: 100%;position: relative;top: 26px;} #content li {display: none;} #content li:first-child { display: block;} #conent li.conFocus {display: block;} .popular-container {padding: 15px 0 0;} .popular-container .popular-list {margin-left: -15px;margin-right: -15px} .popular-container .popular-more {text-align: center;margin-top: 32px;padding-bottom: 50px} .popular-container .popular {margin-bottom: 24px;padding: 0 15px} .popular-container .popular-wrapper {width: 100%;background-color: #fff} .popular-container .popular-preview {width: 100%;cursor: pointer;position: relative} .popular-container .popular-preview img {border-radius: 5px; width: 100%; height:160px} .popular-container .popular-preview .popular-play {top: 50%;left: 50%;width: 64px;height: 64px;margin-left: -32px;margin-top: -32px;position: absolute;background-image: url("../img/bofang.png");background-size: 100% 100%;background-position: center} .popular-container .popular-name {display: block;text-align: center;height: 36px;line-height: 36px;text-decoration: none;color: #666;font-size: 16px} .popular-container .popular-name:hover,.popular-container .popular-name:focus {color: #007bff} .modal.in .modal-dialog{ padding-top: 36px;} .more{color: #2d3460; text-align: center;width: 100%;display: inline-block; line-height: 34px; margin-top:32px; background: url(../img/more.png) no-repeat center; color:#fff;height:34px} /*pingtai*/ .pingtai{ height: 420px; background: url(../img/ptbj.jpg) no-repeat center;background-size:150%; margin-top: 60px;} .timerDiv {text-align: center; color: #fff; width: 80%; margin: 0 auto;} .timerDiv div{ float: left;width: 25%; margin-top:50px ;} .timerDiv span {font-size: 18px;display: block; line-height: 40px;} .more1 a{ display: inline-block; background: url(../img/morebg.jpg) repeat-x;line-height: 50px; color: #fff; text-align: center; border-radius: 6px;width: 100%;} .more1{margin:0 auto ;text-align: center; width: 150px; margin-top: 60px;} .more:hover,.more1 a:hover{ color: #fff;} /*h5*/ .h5site-container {margin-top: 32px} .h5site-container .h5site-list {margin-left: -15px;margin-right: -15px} .h5site-container .h5site {margin-bottom: 24px} .h5site-container .h5site img.h5site-preview {width: 100%;height:326px} .h5site-container .h5site span.h5site-name {display: block;text-align: center;height: 36px;line-height: 36px;text-decoration: none;color: #666;font-size: 16px} .h5site-container .h5site .h5site-image-container {position: relative;cursor: pointer} .h5site-container .h5site .h5site-image-container .h5site-qrcode-modal {opacity: 0;position: absolute;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0, 0, 0, 0.65);display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;transition: opacity .15s ease} .h5site-container .h5site .h5site-image-container .h5site-qrcode {padding: 6px;background-color: #fff} .h5site-container .h5site .h5site-image-container:hover .h5site-qrcode-modal {opacity: 1} .h5site-container .h5site-more {text-align: center;margin-top: 32px;padding-bottom: 50px} .dynamic-container {margin:30px 0 50px} .dynamic-container .dynamic-sub-container {margin-left: -15px;margin-right: -15px} .dynamic-list {list-style: none;padding: 6px 4px 0} .dynamic-container .dynamic-sub-container .dynamic-list.article-list {margin-bottom: 0} .dynamic-container .dynamic-sub-container .dynamic-list li {padding: 2px 0} .dynamic-container .dynamic-sub-container .dynamic-list li a {display: block;color: #666} .dynamic-container .dynamic-sub-container .random-list {list-style: none;padding: 0 4px 6px;height: 25px;overflow: hidden} .dynamic-container .dynamic-sub-container .random-list li {padding: 2px 0} .dynamic-container .dynamic-sub-container .random-list li a {display: block;color: #666} .dynamic-container .dynamic-sub-container .dynamic-wrapper {width: 100%} .dynamic-container .dynamic-sub-container .dynamic-wrapper img {width: 100%} /*adv*/ .adv{ height: 300px; background: url(../img/avbg.jpg) no-repeat center #0c69c0;margin-top: 60px;} .adv1{ width: 1000px !important;} .adv1 li{float:left; width:25%;} .adv1 li div{ float: left; color: #fff;} .adv1 li div p:first-child{ font-size: 20px; margin-top:4px; margin-bottom: 0;} .adv1 li div p{ margin-left: 8px ;} .adv1 li div{margin-top: 40px} .adv1 li div:first-child{ width:30%} .adv1 li div:last-child{ width:65%} .mt{ margin-top: 30px;} .sycj li{ float: left; width: 25%;} .sycj li p{ width: 98%; text-align: center; line-height: 190px; color: #fff; font-size: 20px;} .case li{ margin-bottom: 2%;} .case li:nth-child(odd) { float: left; width:49%;} .case li:nth-child(even) { float: right; width:49%;} .case li > div{margin: 0 auto;background-color: #fff; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); border-radius: 10px; padding: 20px;display: flex;flex-wrap: wrap; justify-content: space-around;align-items: stretch; width: 100%;} .pic{width: 44%;} .pic a{display: inline-block;} .pic img{ width: 100%;display: inline-block;border-radius: 10px;} .wen{width: 55%;} .wen a{ display: block;padding-left: 3%; color: #333; text-align: justify;line-height:24px} .wen h3{ font-size: 16px;margin: 1% 0 1%; font-weight: 600; } a:hover{ text-decoration: none !important;} .wen h3 a{ color: #333;} .wen a:hover{ color: #212ca9;} .wen a.more2{color: #212ca9;} .jian a:hover{ color: #333 !important;} .index-case {background: #fff;} .index-case .is-body {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;} .index-case .is-body .is-content { text-align: center;} .index-case .is-body .is-content h4 { font-size: 30px; font-weight: bold; margin-bottom: 15px; color: #1f2329;} .index-case .is-body .is-content p {font-size: 18px;color: #555;} .index-case .is-body .is-list { margin-top: 30px; position: relative; overflow: hidden; font-size: 0;} .index-case .is-body .is-list .is-tran { position: absolute; z-index: 8;} .index-case .is-body .is-list .is-tran.is-left {left: 0px;} .index-case .is-body .is-list .is-tran.is-right { right: 0px; -webkit-transform: rotate(180deg);transform: rotate(180deg);} .index-case .is-body .is-list .is-line {width: 3976px;-webkit-animation: scrollToRight 36s linear infinite; animation: scrollToRight 36s linear infinite;} .index-case .is-body .is-list .is-line img {width: 50%; display: inline-block;} @-webkit-keyframes scrollToRight { from { -webkit-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0); } to { -webkit-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0); } } @media(max-width:1199px) { .scene-container .swiper-pagination-scene .name-logo { margin-left: 30px; margin-right: 30px} } @media(max-width:767px) { .popular-container .popular-list { padding-bottom: 0; margin-left: 0; margin-right: 0} .popular-container{ padding: 15px 1% 0;} .popular-container .popular-list .popular { margin-bottom: 8px; padding-left: 0; padding-right: 0} .popular-container .popular-list .popular:nth-child(odd){ padding-right: 4px;} .popular-container .popular-list .popular:nth-child(even){ padding-left: 4px;} .popular-container .popular-list .popular-name {font-size: 16px;height: 32px;line-height: 32px} .popular-container .popular-list .popular-preview .popular-play {width: 32px;height: 32px;margin-left: -16px;margin-top: -16px} .popular-container .popular-more { margin-top: 0; padding-bottom: 12px} .skin-container .skin-list {margin-left: -8px; margin-right: -8px} .skin-container .skin-list .skin { margin-bottom: 8px; padding-left: 8px; padding-right: 8px} .h5site-container { margin-top: 16px} .h5site-container .h5site-list { margin-left: -8px; margin-right: -8px} .h5site-container .h5site-list .h5site { margin-bottom: 8px; padding-left: 8px; padding-right: 8px} .h5site-container .h5site-more {margin-top: 0; padding-bottom: 12px} .dynamic-container .dynamic-sub-container .random-list {height: 28px} .popular-container .popular-preview img {border-radius: 5px; width: 100%; height:114px} } .gallery-container {height: auto!important} .gallery-container .gallery-swiper img {max-width: 100%!important;width: 100%} .subnav{display: flex; justify-content: center; list-style-type: none;padding: 0; line-height: 72px; } .subnav li a{ display: inline-block; color: #333;} .subnav li a.thisclass{ color: #0f50e0;} :root {--bs-blue: #0d6efd;--bs-indigo: #6610f2;--bs-purple: #6f42c1;--bs-pink: #d63384;--bs-red: #dc3545;--bs-orange: #fd7e14;--bs-yellow: #ffc107;--bs-green: #198754;--bs-teal: #20c997;--bs-cyan: #0dcaf0;--bs-white: #fff;--bs-gray: #6c757d;--bs-gray-dark: #343a40;--bs-gray-100: #f8f9fa;--bs-gray-200: #e9ecef;--bs-gray-300: #dee2e6;--bs-gray-400: #ced4da;--bs-gray-500: #adb5bd;--bs-gray-600: #6c757d;--bs-gray-700: #495057;--bs-gray-800: #343a40;--bs-gray-900: #212529;--bs-primary: #0d6efd;--bs-secondary: #8f9397;--bs-success: #28a745;--bs-info: #17a2b8;--bs-warning: #ffc107;--bs-danger: #dc3545;--bs-light: #f7f8f9;--bs-dark: #343a40;--bs-primary-rgb: 76, 189, 137;--bs-secondary-rgb: 143, 147, 151;--bs-success-rgb: 40, 167, 69;--bs-info-rgb: 23, 162, 184;--bs-warning-rgb: 255, 193, 7;--bs-danger-rgb: 220, 53, 69;--bs-light-rgb: 247, 248, 249;--bs-dark-rgb: 52, 58, 64;--bs-white-rgb: 255, 255, 255;--bs-black-rgb: 0, 0, 0;--bs-body-rgb: 143, 147, 151;--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family: Roboto, sans-serif;--bs-body-font-size: 0.875rem;--bs-body-font-weight: 400;--bs-body-line-height: 1.6;--bs-body-color: #8f9397;--bs-body-bg: #ffffff; } .pagination li {margin:0 5px;font-size:14px;border:none;border-radius:4px;} .pagination li a {border-radius:4px;color:#6e6e6e !important;background:#fff;padding:5px 10px;border:1px solid #DCDCDC;} .pagination li.active a,.pagination li a:hover {background:#2196f3 !important;color:#fff !important; border:1px solid #2196f3;} .pagination { list-style: none; margin: 0; padding: 0; display: inline-block; vertical-align: bottom} .pagination li { display: inline-block!important; border: solid 1px #EBEBEB; border-radius: 4px} .pagination a { color: #333; padding: 8px 12px; line-height: 18px; display: block; transition: all 1s cubic-bezier(0.175,0.885,0.32,1) 0s} .pagination .disabled a:link,.pagination .disabled a:visited,.pagination .disabled a:hover { cursor: not-allowed; pointer-events: none; color: #EBEBEB} .pagination .active { pointer-events: none} .pagination .active,.pagination a:hover { transition: all .3s cubic-bezier(0.175,0.885,0.32,1) 0s} .post {position: relative;overflow: hidden;padding: 15px;border: 1px solid rgba(0, 0, 0, 0.1);background: #ffffff;} .post .post-info {padding: 1rem;} .post .post-info a {color: #8f9397;} .post .post-info a:hover {color: #0d6efd;} .post .post-tag {padding: 1px 10px;font-size: 12px;border-radius: 3px;position: absolute;top: 28px;right: 20px;} .post .post-tag a {color: #ffffff;} .post .post-tag a:hover {color: #ffffff;} .post .post-author, .post .post-time {display: inline-block;color: #343a40;} .post .post-title {font-size: 18px !important;line-height: 26px;display: block;margin: 15px 0;color: #343a40;} .mb-0{color: #8f9397} .bg-grad {background: linear-gradient(150deg, #0d6efd 0%, #0d6efd 50%, #17a2b8 100%);} .mb{ margin-bottom: 30px;} .price{ display: flex; padding: 10px 0 40px;} .price div{ padding:22px 30px; border-radius: 10px; flex: 1;} .price div:nth-child(2){ margin: 0 24px;} .price dt{font-weight: 600; font-size: 18px; } .price dd{margin-bottom: 16px; line-height: 24px;} .price dl{border-bottom: 1px solid rgba(0,0,0,0.1);} .price li{ list-style: disc; line-height: 24px; margin-left: 42px;} .more3{display: block; text-align: center; background: url(../img/more.png) no-repeat center; color: #fff;font-size: 18px; line-height: 40px; border-radius: 10px; margin-bottom: 30px;} .more3:hover{ color: #fff;} .position{ line-height: 60px; color: #333;} .position a{color: #333;} .title{ line-height: 30px; font-size: 15px; font-weight: 600; text-align: center; margin: 10px;} .neirong{ line-height: 30px; padding: 0px 0 ;} .fy{margin: 20px 0;float: right;} .fy a{ border: 1px solid rgba(0,0,0,0.4); background: #fff; display: inline-block; line-height: 30px; padding: 0 10px; color: #333; } .grid-container {display: flex; flex-wrap: wrap; justify-content: space-around;align-items: stretch; width: 100%; } .grid-item { padding: 28px 0;width: 50%; line-height: 30px;height: 30px; font-size: 16px;} .grid-item i{width: 30px; line-height: 30px; border-radius: 30px;background: url(../img/cpbg.png); color: #fff; text-align: center;display: inline-block; font-size: 18px; margin-right: 6px;} .biaoyu{ margin: 20px 0; height: 50px; line-height: 50px; background: url(../img/by.jpg) repeat-x; color: #fff; font-size: 24px; font-weight: 600; text-align: center; letter-spacing: 1px;} .pc{display: block;}.mobile{ display: none !important;}.line{height: 60px;} .section-sub-title{ padding-bottom: 10px;} .hz{display: flex; flex-wrap: wrap; justify-content: space-around;align-items: stretch; width: 100%} .hz li{width: 20%; margin-bottom: 4px; } .hz img {display: block; width: 98%; margin: 0 auto;border: 1px solid #eee;border-radius: 10px; } .m-cpzx li{float: left;width: 33.33%;text-align: center;margin-bottom: 0;} .ly{margin-left: 20px;}.mobile1{display:none} @media only screen and (min-width: 100px) and (max-width: 640px) { .pc{display: none;} .mobile{ display: block !important;} .mobile1{display:block} .line{ display: none;} .h5site-container .h5site{ margin-bottom:0} .section-container{ width: 100%;} .section-title{ font-size: 2.2rem; letter-spacing: 2px;} .section-sub-title{ margin-top: 10px;font-size: 1.2rem;} #menu li.tabFocus{ border: none; color: #0f50e0;} #content{ top: 0;} .pingtai{ margin-top: 10px; height: auto; padding-bottom: 20px; background-size:300% ;} .section-container{ padding: 16px 0 0;} .timerDiv div{ margin-top: 10px;} .timerDiv span:last-child{ font-size: 12px;} .more1{ margin-top: 10px;} .adv1{ width: 100% !important;} .adv1 li{ padding-left: 0; margin-bottom: 8px;} .adv1 li div{ margin-top: 16px; width: 50%;} .adv1 li div:first-child{ width: 25%; float: left;} .adv1 li div:last-child{ width: 74%; float: right;} .adv1 li{float:left; width:50%;} .adv1 li div p{ margin-left:2px;font-size: 14px;} .adv1 li div p:first-child{ font-size: 1.4rem; margin-top:0; margin-bottom: 2px; } .adv1 li div p:last-child{ font-size: 1.2rem; line-height: 14px;} .adv{ height: auto; margin-top: 20px; padding-bottom: 30px;} .sycj li{ width: 50%;} .container{ padding: 0 1%;} .sycj li p{ line-height: 130px;} .mt{ margin-top: 16px ; padding: 0 2%;} .case li:nth-child(odd){ width: 100%; margin-bottom: 12px;} .case li:nth-child(even){ width: 100%; margin-bottom: 12px;} .case li > div{ padding: 10px;} .wen a{ font-size: 1.1rem;} .wen h3 a{ font-size: 1.5rem;} .wen h3{ margin-top: 4%;} .price{ display:block; padding:10px 0} .mb{margin-bottom:0} .price div:nth-child(2){ margin:0} .price div{margin:2% 0 3%} .dynamic{ padding:0;} .dynamic-wrapper{display: flex; margin: 6px 0 0; width: 100%; overflow: hidden;} .dynamic-wrapper div{ flex: 1;} .dynamic-wrapper ul{ flex: 1; font-size: 1.1rem;} .dynamic-container .dynamic-sub-container .dynamic-list li{ padding: 0} .dynamic-wrapper ul li{ width: 18em; overflow: hidden;} .dynamic-container .dynamic-sub-container .dynamic-wrapper img{ width: 100%; height: auto !important;} .dynamic-container .dynamic-sub-container{ margin: 0;} .dynamic .dynamic-list{ padding-top: 0;} .timerDiv{ width:96%} .section-promote-now .autoBox {width: 100%;display: flex;align-items: center;} .section-promote-now .autoBox .left .normal-use-btn{ margin-left: 0 ;text-align: center; display: inline-block; width: 100%; margin-top: 10px;} .section-promote-now .autoBox .left p{ font-size: 1.4rem; width: 90%; margin: 0 auto;} .section-promote-now .autoBox .left p:nth-child(2){font-size: 1.4rem; width: 70%; margin: 0 auto;} .section-promote-now .autoBox .left{ flex: 3; padding-top: 24px;} .section-promote-now .autoBox .right{ flex: 1;} .section-promote-now .autoBox .right img{ height: auto;} .section-promote-now .autoBox{ height: auto;} .section-promote-now{ height: auto; padding-bottom: 20px;} .friendlink{ width: 85%;} .dynamic-container{ margin: 20px 0;} .h5site-container .h5site{ margin-right: 1%;} .hz li{width: 25%; border-radius: 10px; margin-bottom: 4px;} .more{ padding-top:0} .section-apply-scene{ width:100%} .biaoyu{ line-height:26px; font-size:1.4rem} .webprodetail_zb{ display:none} .ly{margin-left: 0;} .qrcode1,.qrcode {position: fixed;top:50%;left: 50%;transform: translate(-50%, -50%);z-index: 9999;display: none;width:100%;height: 100vh;background:rgba(0,0,0,0.8);} .qrcode1 img,.qrcode img{width:80%;height:auto;margin:0 auto;display: block;position:absolute;top:50%;left: 50%;transform: translate(-50%,-50%); } .normal-use-btn{ display:none !important} } .qrcode {position: fixed;top:50%;left: 50%;transform: translate(-50%, -50%);z-index: 9999;display: none;} .sycj li{ margin: 2px 0;} .price ul{ padding-top:2%} .m-cpzx li a{display: block;margin-left: 0;} .m-cpzx li .img{position: relative;padding-top: 150%;} .m-cpzx li img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;} .m-cpzx li p{color:#eb6887;font-size: 16px;height: 40px;background-color: rgba(255,255,255,.9);line-height: 40px;-o-transition:.3s; -ms-transition:.3s;-moz-transition:.3s;-webkit-transition:.3s;transition:.3s;} @media only screen and (max-width: 959px) { .cpzx-qa .live-video{height: auto;} } @media only screen and (max-width: 767px) { .m-cpzx li{width: 33.33%;} } @media only screen and (max-width: 479px) { .m-cpzx ul{margin:30px 0 0 0;} .m-cpzx li{width:50%;} .m-cpzx li p{font-size: 14px;} } .h5site-qrcode-modal div{width: 90%; margin: 0 auto; } .m-cpzx li .h5site-qrcode-modal div{width: 90%; margin: 0 auto; } .m-cpzx li .h5site-qrcode-modal div img{ width:100%; height:auto; padding:30% 5%} .popular-preview:hover{ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.8);} .swiper-slide,.swiper-slide img,.swiper-wrapper{ width: 100% !important; /* 宽度设置为100% */ height: 100%; /* 高度设置为100% */ } .nav01{display:flex; width:90%; margin:0 auto} .nav01 > a{ width:20%} .nav01{ margin: 22px auto 0; font-size: 1.2rem; border: none;padding: 0;} .nav01 a { height:80px;line-height:130px; background: url(../img/01.png) no-repeat top center; background-size:70% ;text-align:center} .nav01 a:nth-child(2){background: url(../img/02.png) no-repeat top center; background-size:70% ;} .nav01 a:nth-child(3){background: url(../img/03.png) no-repeat top center; background-size:70% ;} .nav01 a:nth-child(4){background: url(../img/004.png) no-repeat top center; background-size:70% ;} .nav01 a:last-child{background: url(../img/05.png) no-repeat top center; background-size:70% ;} .nav01 a.hover01 { height:80px;line-height:130px; background: url(../img/001.png) no-repeat top center; background-size:70% ;text-align:center} .nav01 a.hover01:nth-child(2){background: url(../img/002.png) no-repeat top center; background-size:70% ;} .nav01 a.hover01:nth-child(3){background: url(../img/003.png) no-repeat top center; background-size:70% ;} .nav01 a.hover01:nth-child(4){background: url(../img/0004.png) no-repeat top center; background-size:70% ;} .nav01 a.hover01:last-child{background: url(../img/005.png) no-repeat top center; background-size:70% ;} .nav_con .popular-container:first-child~div{ display: none; }