/*---------------------------------------------- [Index of stylesheet] 1. CSS Reset 2. Global Config 3. Links 4. Layout 5. Pages 6. Others ----------------------------------------------*/ /*-------------------------------------------- [1. CSS Reset] */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { padding:0; margin:0; } fieldset, img, abbr, acronym { border:0; } table { border-collapse:collapse; border-spacing:0; } ol, ul { list-style:none; } address, caption, cite, code, dfn, em, strong, th, var { font-weight:normal; font-style:normal; } caption, th { text-align:left; } h1, h2, h3, h4, h5, h6 { font-weight:normal; } q:before, q:after { content:''; } *, *:after, *:before { -moz-box-sizing:border-box; box-sizing:border-box; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-rendering:optimizeLegibility; } /*-------------------------------------------- [2. Global Config] */ /* html element 62.5% font-size for REM use */ html { /*10 ÷ 16 × 100% = 62.5%*/ font-size: 62.5%; } body { font-size: 1.4rem; /* 1.4rem × 10px = 14px */ line-height: 1.5; font-family: "Helvetica Neue", Helvetica, "微软雅黑", Arial, sans-serif; background-color: #fff; color: #333; } /* headings h1-h6 default font size */ h1 { font-size: 3rem; } h2 { font-size: 2.2rem; } h3 { font-size: 1.8rem; } h4 { font-size: 1.6rem; } h5 { font-size: 1.4rem; } h6 { font-size: 1.2rem; } img { max-width: 100%; max-height: 100%; height: auto; vertical-align:bottom;} input:focus { outline:0; border:1px solid #04A4CC;} /* where are you?! */ .hide { display: none; margin: 0; padding: 0; line-height: 0;} /* clear anything */ .clear:before, .clear:after { content:' '; display:table;} .clear:after { clear:both;} .clear { *zoom:1;} /*-------------------------------------------- [3. Links] */ /* global links style */ a:link, a:visited { text-decoration:none; color: #666; } a:hover { color: #333; } a:active {} /* remove the dotted line around the clicked links */ a { outline: none; transition: color 0.2s ease-in-out, opacity 0.2s ease;} a:active { star:expression(this.onFocus=this.blur());} :focus { outline:0; } /*-------------------------------------------- [4. Layout] */ header { background-color: #fff; color: #999; height: 8rem; z-index: 999; } header h1 { font-size: 2.6rem; display:none; } header #bs-navbar, header #bs-navbar .nav header #bs-navbar .nav li, header #bs-navbar .nav li a { height: 8rem; line-height: 8rem; } header #bs-navbar .nav li a { display: block; overflow: hidden; width: 11rem; padding: 0; text-align: center; } header #bs-navbar .nav li a:hover { color: #333; } .header-default { box-shadow: 0 0 10px rgba(125,125,125,.75); } .header-default #bs-navbar .nav li a { font-size: 1.6rem; } .header-default .logo { background:url(../images/logo.png) 13px center no-repeat; display: block; width: 229px; height: 8rem; margin-left:15px; overflow:hidden; } .header-default .logo { background-image: -webkit-image-set(url(../images/logo.png) 1x,url(../images/logo@2x.png) 2x); } .header-default button { margin-top: 2.2rem; } .header-fixed-top { height: 5rem; line-height: 5rem; } .header-fixed-top #bs-navbar, .header-fixed-top #bs-navbar .nav .header-fixed-top #bs-navbar .nav li, .header-fixed-top #bs-navbar .nav li a { height: 5rem; line-height: 5rem; } .header-fixed-top #bs-navbar .nav li a { font-size: 1.4rem;} .header-fixed-top .logo { background:url(../images/logo-90x30.png) 15px 8px no-repeat; display: block; width: 120px; height: 50px; margin-left:15px; overflow:hidden; } .header-fixed-top .logo { background-image: -webkit-image-set(url(../images/logo-90x30.png) 1x,url(../images/logo-90x30@2x.png) 2x); } .dropdown-menu { opacity: 0.75!important; } .dropdown-menu a { font-size: 1.4rem!important; } /* fix header margin/border */ .navbar { margin-bottom: 0;} .navbar-fixed-top { border-color: #f0f0f0; } .navbar-right { margin-right: 0; } .navbar button { border-color: #ccc; } .navbar button:hover { border-color: #000; } .icon-bar { background-color: #ccc; } .navbar button:hover .icon-bar { background-color: #000; } .navbar-collapse.in { height: 22rem; line-height: 22rem; width: 100%; background-color: #ccc; } /* header navbar */ .active {} /* fix nav caret up/left/right/down */ .caret, .caret-up, .caret-left, .caret-right { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; } .caret { border-bottom: 4px solid\9; border-top: 4px dashed; border-right: 4px solid transparent; border-left: 4px solid transparent; } .caret-up { border-bottom: 4px dashed; border-top: 4px solid\9; border-right: 4px solid transparent; border-left: 4px solid transparent; } .caret-left { border-bottom: 4px solid transparent; border-top: 4px solid transparent; border-right: 4px dashed; border-left: 4px solid\9; } .caret-right { border-bottom: 4px solid transparent; border-top: 4px solid transparent; border-right: 4px solid\9; border-left: 4px dashed; } /* dropdown-menu */ header #bs-navbar .nav .dropdown-menu { border:none; } header #bs-navbar .nav .dropdown-menu li, header #bs-navbar .nav .dropdown-menu li a { display: block; width: 100%; height: 3rem; line-height: 3rem; padding: 0; } .navbar-toggle { border-color: #ccc; } /* fix slippry slider pager be center */ .slippry-container { margin-bottom: 15px; max-height: 780px; overflow: hidden; } .sy-pager { padding: 0 0 0 10px; display: none; } .sy-slide { height: 820px!important; } main {} .home-post { margin-bottom: 1.5rem; } .home-post-none { margin-top: 1.5rem; } .home-post, a.home-post-cover { min-width: 36rem; min-height: 36rem; display: block; overflow: hidden; } .home-post .article-meta-area, .home-post .article-meta-area a, .home-post .article-meta-area h2 { color: #ccc; } .home-post:hover .article-meta-area, .home-post:hover .article-meta-area a, .home-post:hover .article-meta-area h2 { color: #fff; } .article-img { background-color: #f4f4f4; display: block; width: 36rem; height: 36rem; overflow: hidden; } .article-img img { -webkit-transform: scale(1); -webkit-transition: 3s; } .home-post:hover .article-img img { -webkit-transform: scale(1.2); } .article-meta-area { width: 36rem; height: auto; padding: 1rem; background-color: #000; text-align: left; opacity: 0.65; position: absolute; bottom: 0; } .article-meta { margin: 0; padding: 0 0 0 .3rem; line-height: 3rem; height: 2rem; } .article-meta a:hover { text-decoration: underline; } .article-meta span { margin-right: .5rem; } /* sidebar */ .sidebar {} .sidebar-menu { border-radius:.4rem; border: 1px solid #ccc; } .sidebar-menu li a { border-bottom: 1px solid #ccc; display: block; width: 100%; padding-top: .5rem; padding-bottom: .5rem; line-height: 3.6rem; text-align: center; } .sidebar-menu li:last-child a { border-bottom: none; } .sidebar-menu li a:hover { background-color: #f0f8ff; font-weight: bold; color: #666; } .sidebar-menu .current-menu-item a, .sidebar-menu .current-menu-item a:hover { background-color: #3975CE; color: #fff; font-weight: bold; } /* footer */ footer { background-color: #7B858E; width: 100%; font-size: 1.3rem; line-height: 2rem; margin-top: 1.5rem; padding-top: 1.5rem; padding-bottom: 1.5rem; } #footer-menu-wrapper { min-height: 22rem; border-bottom: 1px solid rgba(161,165,169,0.75); padding-top: 1.5rem; padding-bottom: 1.5rem; margin-bottom: 1.5rem;} #footer-menu-wrapper { background:url(../images/bg-city.png) 0 bottom no-repeat; background-size: 100%; } #footer-menu-wrapper { background-image: -webkit-image-set(url(../images/bg-city.png) 1x,url(../images/bg-city@2x.png) 2x); } #footer-menu { overflow: hidden; } #footer-menu ul li a { font-size: 1.6rem; color: #dfdfdf; } #footer-menu ul li a:hover { color: #fff; text-decoration: underline; } #footer-menu .sub-menu a { font-size: 1.2rem; color: #dfdfdf; } #footer-menu .sub-menu { color: #dfdfdf; padding-left: .5rem; list-style-type: disc; list-style-position: inside; } #footer-sub-text { color: #dfdfdf; font-size: 1.2rem; line-height: 1.8rem; text-align: center; } #footer-sub-text a { color: #dfdfdf; } #footer-sub-text a:hover { color: #fff; text-decoration: underline; } .wondersgroup a { padding-left: .5rem; padding-right: .5rem; } .wondersgroup a:first-child { padding-left: 0; } .wondersgroup a:last-child { padding-right: 0; } /* sub-page-banner */ .sub-page-banner { margin-bottom: 15px; margin-top: 15px; overflow: hidden; } .sub-page-banner-wrapper { background-color: #f5f5f5; background-image: -webkit-image-set(url(../images/page-banner.png) 1x,url(../images/page-banner@2x.png) 2x); border-radius: 4px; height: 120px; overflow: hidden; } .default-banner { background-position: center 0; } /* 公司介绍 */ .industry-system-banner { background-position: center -130px;} /* 行业系统 */ .online-operations-banner { background-position: center -260px;} /* 在线运营 */ .offline-service-banner { background-position: center -390px;} /* 线下服务 */ /* breadcrumb */ #breadcrumb-wrapper { margin-top: 0;} .breadcrumb { margin-bottom: 1.5rem;} /* wp_nav_menu */ .wp-nav-menu-fallback a { display: block; padding: 0.5rem; height: 3rem; width: 12rem; background: none!important; border-radius: 0!important; font-size: 1.4rem!important; color: #ccc!important; } .wp-nav-menu-fallback a:hover { background: #fefefe!important; border-radius: 6!important; font-size: 1.4rem!important; color: #333!important; } /* start: post style */ .sr-margin { margin-top: 1.5rem; margin-bottom: 1.5rem; } /* title */ .post h2 a { color: #048d35; } .post h2 small { font-size: 1.4rem; } .page-404 { text-align: center; margin: 10rem 0; } .page-404 h2 { font-size: 28rem; color: #ccc; } .page-404 p { font-size: 1.6rem; color: #999; } .page-404 p a { color: #0067b6; margin-left: .5rem; } .page-404 p a:hover { text-decoration: underline; } #time-counter { color: #0067b6; margin: 0 .5rem 0 0; } /* content */ .entry { min-height: 30rem; margin-top: 1.5rem; border-top: 0.3rem solid #048d35; padding-top: 1.5rem; overflow: hidden; } .entry .no-indent { margin-left: 0; text-indent: 0; } .entry a { color: #0067b6; } .entry a:hover { text-decoration: underline; } .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 { color: #0067b6; margin-bottom: 1.5rem; } .entry p { text-indent: 3rem; } .entry p, .entry dl, .entry ol, .entry ul, .entry pre, .entry table, .entry blockquote { margin-bottom: 1.5rem; } .entry dl, .entry ol, .entry ul { margin-left: 3rem; list-style-position: inside; } .entry ol { list-style-type: decimal-leading-zero; } .entry ul { list-style-type: disc; } .entry dl {} .entry dt { font-weight: bold; } .entry dd { margin-bottom: 1rem; } .entry table { margin-left: 3rem; margin-right: 3rem;} .entry table th { background-color: #f5f5f5; font-weight: bold; } .entry table th, .entry table td { border: 1px solid #ddd; padding: .5rem; } .entry code { background-color: #c7254e; color: #fff; } .entry kbd { background-color:#0067b6; } .entry b, .entry strong { font-weight: bold; } .entry pre p, .entry blockquote p { text-indent: 0; } .entry pre, .entry address, .entry blockquote { padding: 1rem; margin-left: 3rem; margin-right: 3rem; font-size: 1.4rem; } .entry address, .entry blockquote { background-color: #f5f5f5; color: #666; } .alignnone { margin: .5rem 2rem 2rem 0; } .aligncenter, div.aligncenter { display: block; margin: .5rem auto .5rem auto; } .alignleft { float: left; margin: .5rem 2rem 2rem 0; } .alignright { float:right; margin: .5rem 0 2rem 2rem; } a img.alignnone { margin: .5rem 2rem 2rem 0; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto; } a img.alignright { float: right; margin: .5rem 0 2rem 2rem; } a img.alignleft { float: left; margin: .5rem 2rem 2rem 0; } .nomargin { margin: 0!important; } .nopadding { padding: 0!important; } /* end: post style */ /* post & page list style */ .post-list { padding-right: 0!important; } .post-list .post { margin-bottom: 3rem; border-bottom: 1px solid #e6e7e8; } .post-list .post .entry { border-top: none; margin: 0; padding-top: 1rem; padding-bottom: 1rem; min-height: 0!important; } .post-list .post h2 span { color: #048d35; } .post-list .post h2 span a:hover { text-decoration: underline; } .read-more { display: inline-block; width: 100%; height: 1.5; text-align: right; } .read-more:hover { color: #048d35; } /* page navi */ .page_navi { width:100%; height:36px; line-height:36px; text-align:center; overflow:hidden; padding-top:0; margin-top: -1.5rem;} .page_navi a { border-radius: .4rem; padding: 3px 8px; margin:2px; text-decoration:none; color:#999; border:1px solid #ccc;} .page_navi a:hover, .page_navi a.current { border:1px solid #356aa0; color:#356aa0; font-weight:bolder;} /* social share */ .social-share { display: inline-block; height: 3.6rem; line-height: 3.6rem; } .social-share span { margin-right: .5rem; float: left; } .social-share span:last-child { margin-right: 0; } .social-share span.social-share-title { font-size: 1.4rem; } .social-share span a { display: block; width: 3.6rem; height: 3.6rem; line-height: 3.6rem; text-align: center; border: .1rem solid #fff; border-radius: .6rem; overflow: hidden; } .social-share span.social-share-wechat a { background-color: #a8ce46; } .social-share span.social-share-weibo a { background-color: #f5151f; } .social-share span.social-share-wechat a i { font-size: 2rem; color: #cff179; } .social-share span.social-share-weibo a i { font-size: 2.2rem; color: #f57278; } .social-share span a:hover i { color: #fff; } .post-qrcode { position:relative; left: 0.2rem; bottom: 13.5rem; width: 9.6rem; height: 9.6rem; overflow: hidden; z-index: 999; } /* contact page */ #baidu-maps, #wd-contact { height: 52rem; overflow: hidden;} #baidu-maps{} #wd-contact{ border: solid #f3f3f3; border-width: 1px 1px 1px 0;} #wd-contact ol { width: 100%; list-style: disc; color: #dfdfdf; padding-left: 1rem;} #wd-contact ol li { margin: 5px 5px 0 .5rem; line-height: 1; } #wd-contact ol li a { text-decoration: none;} #wd-contact ol li:hover, #wd-contact ol li a:hover { background-color: #f3f3f3; color: #093;} /* toolbox */ .tool-box { position:fixed; bottom:2.4rem; right:.5rem; width:4.6rem; z-index:999;} .tool-box a { background-color: #fefefe; border:0.1rem solid #f3f3f3; display:block; width:3.6rem; height:3.6rem; text-align: center; margin-bottom: 0.5rem;} .tool-box a:hover { background-color: #ccc; } .tool-box a:last-child { margin-bottom: 0;} .tool-box a i { color: #ccc; font-size: 2rem; line-height: 3.6rem; } .tool-box a:hover i { color: #fff;} .tool-box a i.fa-angle-up { font-size: 2rem; } .tool-box .wechat-pop { position: absolute; right: 5.2rem; top: -14.5rem; width: 24rem; box-shadow: 0px 1px 4px rgba(0,0,0,.1); background: #fff;} .tool-box .wechat-pop .qrcode-title { font-size: 1.3rem; line-height: 1.3rem; text-align: center; padding-bottom: 1rem;} .tool-box .wechat-pop .qrcode-box { position: relative;} /* pace.js progress */ .pace { -webkit-pointer-events: none; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; user-select: none;} .pace-inactive { display: none; } .pace .pace-progress { background: #29d; position: fixed; z-index: 9999999999; top: 0; right: 100%; width: 100%; height: 0.2rem;} /* navbar-bottom */ #navbar-bottom { background-color: #f3f3f3; position:fixed; bottom: 0; display: inline-block; height: 4.8rem; width: 100%; border: 1px solid #ccc; border-width: 1px 0 0 0; } #navbar-bottom a { color: #929292; display: block; width: 100%; height: 100%;} #navbar-bottom a:hover, #navbar-bottom .current-menu-item a, #navbar-bottom .current-menu-parent a, #navbar-bottom a:active { color: #386CFF; } #navbar-bottom a i { font-size: 2.2rem; height: 2.8rem; padding-top: .6rem; } #navbar-bottom a span { display: block; font-size: 1rem; height: 2rem; overflow: hidden; padding-bottom: .3rem; } .navbar-bottom-home {} .navbar-bottom-system {} .navbar-bottom-online {} .navbar-bottom-offline {} #navbar-bottom .sub-menu { display: none; } .navbar-bottom-list { margin:0 auto; list-style-type:none; width:100%; height:100%; } .navbar-bottom-list li { float: left; width: 25%; height:100%; text-align:center; position:relative; font-size:1.4rem; } /******************* @media screen width *******************/ /* 超小屏幕(小于 768px) */ @media (max-width: 767px) { .post-list { padding-left: 0!important; padding-right: 0!important; } main { margin-top: 2rem!important; margin-bottom: 5rem!important; text-align: center!important; } .home-post { float: none!important; width: auto; display: table; margin: 0 auto 2rem auto!important; text-align: center!important; } .section { margin-top: 2rem!important; margin-bottom: 3rem!important; } .logo { width: 100%!important; background-position: center center!important; margin-left: 0!important; } .article-meta-area { display: block!important; } .grid-items { float: none; text-align: center; } .page_navi { margin-bottom: 3rem; } } /* 小屏幕(平板,大于等于 768px) */ @media (min-width: 768px) and (max-width: 991px) { main { margin-top: 2rem!important; margin-bottom: 0!important; text-align: center!important; } .home-post { float: none!important; width: auto!important; display: table!important; margin-left: auto!important; margin-right: auto!important; text-align: center!important; } .section { margin-top: 2rem!important; margin-bottom: 3rem!important; } } /* 中等屏幕(桌面显示器,大于等于 992px) */ @media (min-width: 992px) and (max-width: 1199px) { main { margin-top: 2rem!important; margin-bottom: 0!important; text-align: center!important; } .home-post { width: auto!important; display: table!important; margin-left: auto!important; margin-right: auto!important; text-align: center!important; } } /* 大屏幕(大桌面显示器,大于等于 1200px) */ @media (min-width: 1200px) {}