*, :after, :before { box-sizing: border-box; word-break: break-all; -moz-user-select: none; /*火狐*/ -webkit-user-select: none; /*webkit浏览器*/ -ms-user-select: none; /*IE10*/ -khtml-user-select: none; /*早期浏览器*/ user-select: none; } html { line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); height: 100%; } body { background-color: #fff; } html, body { margin: 0; font-weight: 400; line-height: 1.75; color: #444; text-align: left; font-size: 10px; } article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; } [tabindex="-1"]:focus { outline: 0 !important; } h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 1rem; } p { margin-top: 0; margin-bottom: 2rem; } address, dl, ol, ul { margin-bottom: 2rem; } dl, ol, ul { margin-top: 0; } ol ol, ol ul, ul ol, ul ul { margin-bottom: 0; } dt { font-weight: 700; } dd { margin-left: 0; } b, strong { font-weight: bolder; } html, body, dd, div, dl, dt, li, p, ul { line-height: 1.75; font-family: "\5FAE\8F6F\96C5\9ED1", Microsoft YaHei, Heiti SC, Helvetica Neue, Helvetica, Arial, sans-serif; } input:focus, button:focus { outline: none; outline-width: 0; } input, button { border-radius: 0; } .page { width: 640px; min-height: 100vh; margin: 0 auto; position: relative; overflow: hidden; background-color: white; padding-top: 6rem; padding-bottom: 10rem; } .main { width: 1200px; margin: 0 auto; position: relative; } .bdr-zero { border-radius: 0; } .bd-none { border: none; } .bg-transparent { background: transparent; } .bg-white { background-color: #fff; } .bg-gray { background-color: #f4f4f4; } .bg-main { background-color: #06c; } .c-white { color: white; } .f-l { float: left; } .f-r { float: right; } a, a:link, a:hover, a:active, a:visited { color: #333; text-decoration: none; } .text-truncate { display: block; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .t-l { text-align: left; } .t-c { text-align: center; } .t-r { text-align: right; } .ovh { overflow: hidden; } ul, li { list-style: none; margin: 0; padding: 0; } .dis-block { display: block; } .dis-none { display: none; } textarea::-webkit-input-placeholder, input::-webkit-input-placeholder { color: #999; } textarea::-moz-input-placeholder, input::-moz-input-placeholder { color: #999; } textarea::-ms-input-placeholder, input::-ms-input-placeholder { color: #999; } img { max-width: 100%; } .pos-rel { position: relative; } .spl { height: 4rem; clear: both; } .tri { width: 0; height: 0; overflow: hidden; border-width: 0.9rem; border-color: transparent transparent #fff transparent; border-style: dashed dashed solid dashed; margin-left: -0.9rem; } .bd-bottom { border-bottom: 1px solid #eee; } .text-truncate { display: block; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } a.btn-danger { color: white; } a.btn-shadow { border-radius: 0; border: 2px solid #ccc; color: #777; } /* common */ .cols { margin: 0 -3%; overflow: hidden; } .col-quarter { display: block; width: 19%; margin: 0 3%; position: relative; } .col-quarters { display: block; width: 69%; margin: 0 3%; position: relative; } .col-third { display: block; width: 27.3333%; margin: 3%; position: relative; } .col-thirds { display: block; width: 59.6666%; margin: 0 3%; position: relative; } .col-half { display: block; width: 44%; margin: 0 3%; position: relative; } .btn-more { display: block; width: 15rem; font-size: 1.6rem; padding: 1rem 2rem; border: 1px solid #06c; border-radius: 5rem; margin: 6rem auto 0; overflow: hidden; clear: both; text-align: center; } .btn-more::after { content: "查看更多"; color: #06c; } .cont { font-size: 1.6rem; margin-bottom: 3rem; } .cont .ttl dt { background-image: none; font-size: 2.4rem; padding-bottom: 0; } .cont img { max-width: 100%; height: auto; } .search-info { font-size: 1.6rem; padding: 1rem; margin: 2rem 0; background-color: #eee; } .search-info span { padding-right: 3rem; } dl.ttl { font-size: 3rem; text-align: center; margin: 2rem 0; } dl.ttl dt { padding: 2.5rem 0; background: url(../images/share/bg_ttl.jpg) no-repeat center bottom; font-weight: normal; } dl.ttl dd { font-size: 1.4rem; color: #999; padding-top: 1rem; } /* icon */ .icon-solution { background: url(../images/index/solution/1.png) no-repeat center center; } .icon-solution-2 { background-image: url(../images/index/solution/2.png); } .icon-solution-3 { background-image: url(../images/index/solution/3.png); } .icon-solution-4 { background-image: url(../images/index/solution/4.png); } .icon-solution-5 { background-image: url(../images/index/solution/5.png); } .icon-solution-6 { background-image: url(../images/index/solution/6.png); } .icon-solution-7 { background-image: url(../images/index/solution/7.png); } .icon-solution-8 { background-image: url(../images/index/solution/8.png); } /* top */ #top { background: url(../images/share/bg_top.png) repeat-x center top; height: 8.3rem; display: flex; max-width: 192rem; margin: 0 auto; } #top .logo { display: inline-block; height: 8.3rem; float: left; margin-right: 5rem; } #top .f-l, #top .f-r { height: 8.3rem; flex: 1; } #top .f-r { background: url(../images/share/bg_top_right.jpg) no-repeat left top; } /* nav */ #nav { font-size: 1.8rem; margin-right: 2rem; } #nav > ul { display: flex; } #nav > ul > li { flex: 1; position: relative; } #nav > ul > li:last-of-type { flex: 0.5; } #nav > ul > li { float: left; line-height: 78px; height: 78px; text-align: center; } #nav > ul > li a, #nav > ul > li { display: block; color: white; } #nav .sub { display: none; } #nav > ul > li:hover, #nav > ul > li.active { background-color: #555; } #nav .tri { position: absolute; left: 50%; top: 6rem; z-index: 21; display: none; } /* search */ #nav form { display: none; position: absolute; bottom: -5rem; right: 0; line-height: normal; z-index: 20; border: 1px solid #ddd; border-radius: 3.5rem; overflow: hidden; } #nav form input, #nav form button { border: none; height: 3.5rem; background-color: transparent; } #nav form input { padding-left: 2rem; } #nav form input::-webkit-input-placeholder, #nav form input:-moz-placeholder, #nav form input::-moz-placeholder, #nav form input:-ms-input-placeholder { color: white; } #nav form button { width: 6rem; background: url(../images/share/search_split.jpg) no-repeat left center; } /* sub-nav */ #nav .sub { position: absolute; top: 78px; left: 0; background-color: #fff; width: 100%; z-index: 20; box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); } #nav .sub li { line-height: 2.4em; } #nav .sub li > a { display: block; color: #333; height: 2.4em; } #nav .sub li.active > a, #nav .sub li:hover > a { background-color: #06c; color: #fff; } /* banner */ .carousel-indicators { margin-bottom: 0; } .carousel-control { opacity: 1; width: 10%; } .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev { color: white; opacity: 1; } .carousel-indicators li { width: 1.5rem; height: 1.5rem; border: none; margin: 0 0.5rem; background-color: rgba(130, 130, 130, 0.5); } .carousel-indicators .active { width: 1.5rem; height: 1.5rem; margin: 0 0.5rem; background-color: #06c; } /* 分类导航 */ .cat-nav { margin: 0 auto; overflow: hidden; text-align: center; clear: both; } .cat-nav > a { display: inline-block; padding: 0.8rem 2rem; border: 1px solid #aaa; border-radius: 1rem; background-color: #fff; font-size: 1.8rem; margin: 1rem; } .cat-nav > a.active { border-color: #06c; background-color: #06c; color: white; } /* breadcrumb */ .breadcrumb { margin: 2rem 0; font-size: 1.6rem; } /* tab */ .tab-block { } .tab-cont > div { display: none; } .tab-cont > div:first-of-type { display: block; } /* list */ .list-img { overflow: hidden; clear: both; } .list-img > a { display: block; float: left; } .list-img > a:hover, .list-img > a.active { box-shadow: 0 0 1rem #ccc; } .list-img > a:hover dt, .list-img > a.active dt { color: #06c; } .list-img > a .img, .list-img > a img { -webkit-transition: 0.6s; transition: 0.6s; } .list-img > a .img { width: 100%; position: relative; overflow: hidden; } .list-img > a img { width: 100%; position: absolute; } .list-img > a:hover img { -webkit-transform: scale(1.2); transform: scale(1.2); } .list-img > a > dl { text-align: center; margin: 2rem 1rem; } .list-img > a dt { font-size: 2rem; font-weight: normal; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .list-img > a dd { font-size: 1.6rem; color: #ccc; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .list-news { overflow: hidden; clear: both; margin: 0 -2%; } .list-news > a { display: block; float: left; width: 50%; margin: 0; padding: 4rem 2%; } .list-news > a:hover dt, .list-news > a.active dt { color: #06c; } .list-news > a .img, .list-news > a img { -webkit-transition: 0.6s; transition: 0.6s; } .list-news > a .img { width: 36%; float: left; margin-right: 2rem; position: relative; overflow: hidden; } .list-news > a img { width: 100%; position: absolute; } .list-news > a:hover img { -webkit-transform: scale(1.2); transform: scale(1.2); } .list-news > a dl { margin-bottom: 0; } .list-news > a dt { font-weight: normal; font-size: 1.8rem; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .list-news > a dd { font-size: 1.4rem; text-align: justify; color: #999; } .list-news > a dd:last-of-type { color: #ccc; padding-top: 0.5rem; } .list-news > .line { height: 1px; background-color: #ccc; clear: both; } .list-text dl { border-bottom: 1px dashed #eee; padding-bottom: 5px; margin-bottom: 1rem; } .list-text dt { font-size: 18px; font-weight: normal; color: #333; margin-bottom: 6px; line-height: normal; } .list-text dd { line-height: normal; height: 56px; overflow: hidden; } .list-text a { padding: 1rem 0; border-bottom: 1px solid #eee; } .list-text a i { font-style: normal; float: right; padding-left: 5px; } .list-text li:first-of-type { margin-top: -5px; } /* side */ .side-nav { line-height: 4rem; text-align: center; } .side-nav dt { background-color: #06c; width: 100%; padding: 1rem; margin-bottom: 1rem; font-size: 2rem; color: white; } .side-nav a { position: relative; padding: 0.5rem 1rem; margin-bottom: 1rem; display: block; background-repeat: no-repeat; background-position: 1.5rem center; background-color: #eee; font-size: 1.6rem; } .side-nav > ul > li:hover a { background-color: #06c; color: white; } .side-nav a.active { background-color: #555; color: white; } .side-nav > ul > li { position: relative; } .side-nav > ul > li .sub { display: none; position: absolute; left: 100%; top: 0; width: 100%; } .side-nav > ul > li:hover .sub { display: block; } .side-nav > ul > li:hover .sub a { background-color: #eee; color: #333; } .side-nav > ul > li:hover .sub > li:hover a { background-color: #06c; color: white; } /* links */ #links > dt { font-size: 1.8rem; font-weight: 500; border-bottom: 1px solid #ccc; line-height: 2.4; margin-bottom: 1.5rem; } #links > dd { font-size: 1.5rem; } #links > dd a { color: #999; } #links > dd a:after { content: "|"; padding: 0 1rem; } #links > dd a:last-of-type:after { content: ""; padding: 0; } /* footer */ #footer a { color: white; } #footer .bg-gray .main { overflow: hidden; padding: 5rem 0; } #footer .bg-gray .main div { width: 11%; margin: 0 2%; float: left; } #footer .bg-gray .main div:first-of-type, #footer .bg-gray .main div:last-of-type { width: 21%; } #footer .bg-gray .main dt { font-size: 1.8rem; margin-bottom: 0.5rem; } #footer .bg-gray .main dd { font-size: 1.5rem; color: #666; } #footer .bg-gray .main a { display: block; padding: 0.5rem 0; color: #666; } #footer .bg-main { color: white; overflow: hidden; } #footer .bg-main .f-r { padding: 2rem 0; } #footer .bg-main img { max-height: 5rem; margin-top: 0.5rem; } /* fix */ .navbar-brand { padding: 5px 15px; } .navbar-brand > img { max-height: 100%; } .navbar-default { background-color: #06c; border: none; } .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover { color: #fff; background-color: #555; } .navbar-default .navbar-nav > li > a { color: white; } .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover { color: white; } .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover { background-color: #555; color: white; } .dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover { background-color: #06c; color: white; } .navbar-form input { border: none; } .navbar-default .navbar-toggle { background-color: #fff; border: none; } .navbar-default .navbar-toggle .icon-bar { background-color: #06c; } .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background-color: #fff; } .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus, .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover { color: white; } .pagination { margin: 2rem auto; } .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover { background-color: #06c; border-color: #06c; } .pagination > li > a, .pagination > li > span { color: #333; padding: 0.6rem 1.2rem; } .carousel-inner > .item > a > img, .carousel-inner > .item > img { margin: 0 auto; } .carousel-control.left, .carousel-control.right { background-image: none; }