锘緻charset "utf-8"; /* CSS Document */ body { margin: 0px; padding: 0px; background: #000000; position: relative; overflow-x: hidden; } @media(min-width:992px) { body { padding-top: 100px!important; } } @media(min-width:1600px) { body { padding-top: 100px!important; } } @media(max-width:992px) { body { padding-top: 70px!important; } } @media(max-width:768px) { body { padding-top: 60px!important; } } * { font-family: Arial, "寰蒋闆呴粦", Microsoft YaHei; } @font-face { font-family: 'Impact'; src: url(../font/impact.ttf), url(../font/impact.ttf); font-weight: normal; font-style: normal; } .impact { font-family: 'Impact', Arial, "寰蒋闆呴粦"; } dd, dl, dt, ul, li { margin: 0; padding: 0; list-style: none; } input { margin: 0; outline: none } a { text-decoration: none; } a:hover { text-decoration: none; } a:focus { text-decoration: none; } a:hover, a:focus, input:hover, input:focus, button:focus, button:hover { outline: none; } h1 { margin: 0px; } i { font-weight: normal; } hr { border: none; border-top: 1px solid #f0f0f0; margin: 10px 0px; } img { max-width: 100%; } pre { display: block; border: none; background: none; padding: 0px; white-space: pre-wrap; font-family: "寰蒋闆呴粦", Microsoft YaHei; } ::-webkit-scrollbar-track { background:#CCC; } ::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar-thumb { background:#4d4d4d; } /*婊氬姩鏉¤缃?/ /*琛ㄦ牸杈规鏍峰紡*/ table, tbody, tr, td { border: none; } table tr { border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; } table td { font-size: 14px; line-height: 24px; padding: 15px; border-left: 1px solid #e6e6e6; border-top: 1px solid #e6e6e6; ; } table td p { margin: 0px; } /*boostrap閬僵灞傚鑷撮〉闈㈡姈鍔?/ .modal-open { overflow: scroll !important; } /*椤甸潰鍐呭瀹藉害*/ /*椤甸潰haed*/ /*瀵艰埅璁剧疆*/ #haed-nav { position: fixed; z-index: 999; left: 0; right: 0; height: 100px; line-height: 100px; background: #000; box-shadow: 0px 0px 8px rgba(0,0,0,0.15); transition: all .3s; } #haed-nav .container { height: inherit; } .navbar-header { height: inherit; } /*logo璁剧疆*/ .navbar-brand { position: relative; z-index: 9; display: flex; align-items: center; height: inherit; padding: 0px!important; margin: 0px!important; } .navbar-brand h1 { height: auto; font-size: 0px; } .navbar-brand img { max-width: auto; height: 50px; transition: all .3s; } /*瀵艰埅鍙充晶鍔熻兘鍖?/ .language { position: absolute; z-index: 2; right: 0; top:50%; transform:translate(0%,-50%); } .language a{ display: inline-block; padding:0 10px 0 20px; font-size: 15px; line-height: 38px; color: #138ce2; border-radius: 40px 0 0 40px; border:1px solid #138ce2; border-right: 0PX; transition:all .4s; } .language a:hover{ padding:0 15px 0 25px; color: #fff; background: #138ce2; } @media(max-width:992px) { .language{ display: none; } } /*瀵艰埅璁剧疆*/ .navbar-nav .dropdown-menu { position: absolute; z-index: 1; background: none; box-shadow: none; border: none; } .navbar-nav { height: inherit; } .navbar-nav>li { height: inherit; line-height: inherit; display: flex; align-items: center; margin: 0px 15px; } .navbar-nav>li>a { position: relative; z-index: 1; height: inherit; color: #999; font-size: 16px; line-height: inherit; padding: 0px 15px; text-align: center; overflow: hidden; } .navbar-nav>li:hover>a { color: #138ce2; background: none; } .navbar-nav>li.on>a { color: #138ce2; } .navbar-nav>li>a:after { content: ""; position: absolute; z-index: 1; bottom: 0px; left: 50%; width: 0%; height: 3px; background-color: #138ce2; transition: all .3s; } .navbar-nav>li.on>a:after, .navbar-nav>li:hover>a:after { content: ""; left: 0; width: 100%; } .navbar-nav .dropdown-menu { top: 100%; left: 50%; min-width: 80px; padding:5px 0 0; border: none; border-radius: 0px; background: rgba(0,0,0,0.7); transform:translate(-50%,0%); } .navbar-nav .dropdown-menu li { display: block; width: auto; height: auto; line-height: normal; } .navbar-nav .dropdown-menu li a { position: relative; z-index: 3; display: block; box-sizing: border-box; vertical-align: middle; min-width: 100%; padding: 0px 25px; font-size: 14px; text-align: center; line-height: 46px; height: 46px; color: #666; white-space: nowrap; border-bottom: 1px solid rgba(255,255,255,0.1); transition: all ease .3s; } .navbar-nav .dropdown-menu li:last-child a { border-bottom:none; } .navbar-nav .dropdown-menu li a:hover { color: #138ce2; background: none; } @media (max-width: 1200px) { } /*瀵艰埅鏍忓彉鍖?/ @media (max-width: 1200px) { .navbar-nav>li { margin: 0px 8px; } .nav-logo-text>div p { font-size: 0px; } .nav-logo-text>div p span { font-size: 24px; line-height: 1em; } .nav-logo-text>div small { display: none; } } @media(max-width:992px) { #haed-nav { height: 70px; line-height: 70px; } #haed-nav .navbar-brand img { height: 40px; } .nav-logo-text>div p, .nav-logo-text>div p span { font-size: 22px; } #haed-nav .navbar-nav { display: none; } } @media (max-width: 768px) { #haed-nav { height: 60px; line-height: 60px; } #haed-nav .navbar-brand img { height: 32px; } .navbar-header { margin-left: 0px!important; margin-right: 0px!important; display: inline-block; padding: 0px; width: auto; } .nav-logo-text { margin-left: 15px; } .nav-logo-text>div p { font-size: 0px; } .nav-logo-text>div p span { font-size: 22px; line-height: 1em; } } /*绉诲姩绔彍鍗?*/ #menuNav { font-family: '寰蒋闆呴粦'; position: fixed; z-index: 1001; left: 0; right: 0; top: 0; bottom: 0; padding-top: 70px; background: #1b1b1b; opacity: 0; visibility: hidden; -webkit-transition: all 0.5s linear 0.6s; -moz-transition: all 0.5s linear 0.6s; -ms-transition: all 0.5s linear 0.6s; -o-transition: all 0.5s linear 0.6s; transition: all 0.5s linear 0.6s; overflow-y: scroll; } #menuNav.open { opacity: 1; visibility: visible; -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -ms-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; } @media (min-width: 992px) { #menuNav { display: none; } } #menuNav-logo { position: absolute; z-index: 1; left: 0; right: 0; top: 0; display: flex; align-items: center; height: 70px; padding: 0 3%; background: #000; box-shadow: 0 0 15px rgba(255,255,255,0.1); } #menuNav-logo a { height: 50px; margin-left: 15px; white-space: nowrap; overflow: hidden; } #menuNav-logo img { float: left; display: inline-block; height: 40px; vertical-align: middle; } #menuNav-close { position: absolute; z-index: 2; top: 0px; right: 3%; margin-top: 12px; margin-right: 6px; display: block; width: 48px; height: 48px; text-align: center; color: #333; background: none; border: none; } #menuNav-close span { display: inline-block; font-size: 28px; line-height: 48px; color: #333; } .navList { position: relative; z-index: 2; padding-left: 25%; padding-right: 20px; padding-top: 30px; padding-bottom: 30px; margin: 0px; width: 100%; } .navList:after { content: ""; position: absolute; z-index: 3; top: 0px; left: 15%; width: 1px; height: 100%; background-color: rgba(255,255,255,0.2); transition-delay: 0.2s; transition: all .3s; } .navList li { -webkit-transform: translateY(20%); -moz-transform: translateY(20%); -ms-transform: translateY(20%); transform: translateY(20%); opacity: 0; visibility: hidden; -webkit-transition: all .6s; -moz-transition: all .6s; transition: all .6s } #menuNav.open .navList li { transform: none; opacity: 1; visibility: visible; vertical-align: top; margin-bottom: 10px; } .navList>li>a { position: relative; display: block; font-size: 18px; line-height: 1.2; padding: 1vh 0; color: #138ce2; } .navList>li:hover>a { color: #138ce2; } .navList { counter-reset: compteListe; } .navList>li>a::before { counter-increment: compteListe 1; content: "0" counter(compteListe); color: #138ce2; position: absolute; font: 400 normal 12px/12px 'mono'; right: calc(100% + 68px); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: translateY(-50%) rotate(-90deg); transform: translateY(-50%) rotate(-90deg); } .navList>li>a:after { content: ""; position: absolute; z-index: -1; top: 50%; left: 0%; width: 0%; height: 1px; background-color: rgba(0,0,0,0.3); transition: all .4s; } .navList>li:hover>a:after { content: ""; width: 100%; } .navList>li>a>span { position: relative; z-index: 2; display: inline-block; padding-right: 20px; background: #000; } .navList li .dropdown-menu { position: absolute; left: 100%; top: 0px; padding-left: 25px; background: none; border: none; box-shadow: none; } .navList li .dropdown-menu a { font-size: 16px; line-height: 1.2; padding: 1vh 0; color: #999; } .navList li .dropdown-menu a:hover { color: #4d4d4d; background: none; } /* 鐖剁骇涓嬬殑閫掑鏁板瓧 */ .navList { counter-reset: compteListe; } .navList>li>a::before { counter-increment: compteListe 1; content: "0" counter(compteListe); color: #138ce2; position: absolute; font: 400 normal 12px/12px 'mono'; right: 118%; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: translateY(-50%) rotate(-90deg); transform: translateY(-50%) rotate(-90deg); } .navList>li>a:after { display: none; } .navList>li>a>span { position: relative; z-index: 2; display: inline-block; padding-right: 20px; background: #000; } .navList li .dropdown-menu { position: static; display: block; float: none; padding-left: 10px; margin: 0px; } .navList li .dropdown-menu a { font-size: 14px; } .navList li .dropdown-menu a:hover, .navList li .dropdown-menu a:focus { color: #4d4d4d; background: none; } .nav-button { display: none; align-items: center; height: inherit; background: none; border: none; float: right; margin-left: 20px; } .nav-button span { display: inline-block; font-size: 32px; line-height: 42px; height: 42px; color: #138ce2; vertical-align: middle; } .menu-shop { padding: 15px 0px; border-bottom: 1px solid rgba(0,0,0,0.2); background: #333; } .shop-box { display: flex; } .menu-shop a { display: block; width: 100%; font-size: 14px; line-height: 24px; color: #999; text-align: center; border-right: 1px solid rgba(255,255,255,0.2); } .menu-shop a:hover { color: #138ce2; } .show-box { max-width: 600px; margin: auto; } @media (max-width: 992px) { .nav-button { display: block; margin-left: 15px; } } @media (max-width: 768px) { #menuNav{ padding-top: 60px; } #menuNav-logo { height: 60px; padding: 0 15px; box-shadow: 0 0 15px rgba(0,0,0,0.1); } #menuNav-logo a { height: 32px; margin: 0px; } #menuNav-logo a img{ height: 32px; } #menuNav-close { right: 10px; margin-right: 0px; padding: 0px; margin-top: 5px; } } /*鎵嬫満鑿滃崟 end*/ /*鍥剧墖鏀惧ぇ*/ .zoom-img { overflow: hidden; } .zoom-img img { width: 100%; transform: scale(1); transition: all ease 0.6s; } .zoom-img:hover img { transform: scale(1.2); } /*棣栭〉浜у搧鎺ㄨ崘*/ .product-hot{ background: #151515; } .product-hot .row{ margin-left: -8px; margin-right: -8px; } .index-p{ display: flex; } .index-p a{ display: block; height: 100%; padding: 8px; transition: all ease 0.4s; } .index-p a:hover{ box-shadow: 0 0 30px rgba(0,0,0,0.7); } .index-p .index-p-l,.index-p .index-p-r{ width: 50%; } .index-p .index-p-l{ width: 50%; } .index-p .index-p-r>div{ width: 100%; height: 50%; } .index-p .index-p-bottom{ display: flex; } .index-p .index-p-bottom>div{ width: 50%; } .index-p .zoom-img{ overflow:visible; } .index-p .zoom-div{ height: 100%; } .index-p .zoom-img:hover img { transform: scale(1.05); } .index-p .zoom-div>div{ height:100%; background-position: center; background-size: cover; transform: scale(1); transition: all ease 0.6s; } .index-p .zoom-div:hover>div{ transform: scale(1.05); transition: all ease 0.6s; } .index-p .index-p-l .zoom-div>div{ padding-bottom: 100%; height: 0px; } @media (max-width: 992px) { .index-p { padding:0 10px; flex-wrap: wrap; } .index-p .index-p-l,.index-p .index-p-r{ width: 100%; } .index-p .zoom-div>div{ padding-bottom: 50%; height:0%; } } /*棣栭〉椤佃剼*/ #foot { position: relative; } .foot-nav { padding: 35px 0px; text-align: center; } .foot-nav a{ display: inline-block; padding: 0px 30px; font-size: 15px; line-height: 16px; color: #585858; border-left: 1px solid rgba(255,255,255,0.1); transition: all ease .4s; } .foot-nav a:first-child{ border-left: none; } .foot-nav a:hover{ color: #138ce2; } .foot-copyright{ font-size: 14px; line-height: 22px; color: #666; text-align: center; padding-bottom: 15px; } .foot-copyright p{ font-size: 16px; } .foot-copyright a{ display: inline-block; color: #666!important; } .foot-copyright a:hover{ color: #138ce2!important; } .foot-copyright a,.foot-copyright span{ margin-left: 8px; } .foot-copyright :nth-child(2){ margin-bottom: 0px; } /*============ 棣栭〉end ============*/ /*鍐呴〉鍏叡*/ /*鍐呴〉banner*/ .inside-banner { position: relative; z-index: 1; width: 100%; } .banner-pc { display: block; width: 100%; } .banner-mobile { display: none; width: 100%; } .inside-banner-t{ position: absolute; z-index: 2; left: 0; right: 0; top: 0; bottom: 0; } .inside-banner .container{ position: relative; height: 100%; } .inside-text { position: absolute; z-index: 2; left: 0; right: 0; top: 0; bottom: 0; display: flex; align-items: center; padding: 0px 15px; } .inside-text>div { position: relative; z-index: 1; width: 100%; } .inside-text>div h3 { margin: 0px 0 15px; font-size: 22px; line-height: 1em; color: #fff; } .inside-text>div p { font-size: 30px; line-height: 1.2em; color: #fff; } @media(max-width:992px) { .inside-text>div h3 { font-size:18px; } .inside-text>div p { font-size:24px; } } @media(max-width:768px) { .banner-pc { display: none; } .banner-mobile { display: block; } .inside-text>div h3 { font-size:20px; } .inside-text>div p { font-size:18px; } } /*鍐呴〉瀵艰埅*/ .inside-subnav{ background: #0f0f0f; border-top:1px solid rgba(255,255,255,0.05); border-bottom:1px solid rgba(255,255,255,0.05); } .inside-subnav .subnav{ text-align: right; } .inside-subnav .subnav li{ display: inline-block; margin-left: 20px; } .inside-subnav .subnav li a{ display: inline-block; position: relative; padding: 0px 20px; font-size: 13px; line-height: 70px; color: #999; font-weight: bold; transition:all .4s; } .inside-subnav .subnav li.on a,.inside-subnav .subnav li a:hover{ color: #138ce2; } .inside-subnav .subnav li a:after{ content:""; position: absolute; z-index:1;bottom: 0px;left: 50%;width: 0%;height: 2px;background-color:#138ce2;transition:all .4s;} .inside-subnav .subnav li.on a:after,.inside-subnav .subnav li a:hover:after{ content:"";left: 0%;width: 100%;} .inside-subnav .dropdown{ display: none; } .inside-subnav .dropdown>a b.arrow{ position: absolute; z-index: 1; right:12px; top: 14px; display: inline-block; width: 8px; height: 8px; border-bottom: 2px solid #999; border-right: 2px solid #999; transform: rotate(45deg); } @media(max-width:768px) { .inside-subnav .subnav{ display: none; } .inside-subnav .dropdown{ display: block; margin:15px 10px; } .inside-subnav .dropdown>a{ position: relative; display: block; padding: 10px 25px 10px 15px; border:1px solid rgba(255,255,255,0.05); font-size: 13px; line-height: 20px; font-weight: bold; color: #138ce2; background: #222; } .inside-subnav .dropdown .dropdown-menu{ margin: 0px; width: 100%; border:1px solid rgba(255,255,255,0.05); border-top: 0px; border-radius: 0px; background: #333; } .inside-subnav .dropdown .dropdown-menu li a{ font-size: 13px; color: #ccc; line-height: 30px; } .inside-subnav .dropdown .dropdown-menu li:focus,.inside-subnav .dropdown .dropdown-menu li:hover{ background:none!important; } .inside-subnav .dropdown .dropdown-menu li:focus a,.inside-subnav .dropdown .dropdown-menu li:hover a{ color: #138ce2!important; background: rgba(255,255,255,0.05)!important; } } /*浜岀骇瀛愭爮鐩?/ .subnav2{ margin-top: -20px; margin-bottom: 40px; text-align: right; } .subnav2 li{ display: inline-block; margin: 3px; } .subnav2 li a{ display: inline-block; padding:0 20px; font-size: 14px; line-height: 32px; color: #666; background: #222; transition:all .3s; } .subnav2 li a:hover{ color: #138ce2; } .subnav2 li.on a{ color: #fff; background: rgba(19,140,226,0.8); } @media(max-width:768px) { .subnav2{ margin-top: -10px; margin-bottom: 30px; text-align: center; } .subnav2 li{ display: inline-block; margin: 2px; } .subnav2 li a{ padding:0 15px; font-size: 14px; line-height: 32px; } } /*鐩掑瓙杈硅窛*/ .inside-box { position: relative; z-index: 1; padding: 80px 0; background-color: #151515; } .padding-box { padding-top: 6vh; padding-bottom: 6vh; } .margin-bottom { margin-bottom: 6vh; } @media(max-width:992px) { .inside-box { padding: 60px 0; } .padding-box { padding-top: 7vh; padding-bottom: 7vh; } .margin-bottom { margin-bottom: 7vh; } } @media(max-width:768px) { .inside-box { padding: 40px 0px; margin: 0px auto 40px; } .padding-box { padding-top: 5vh; padding-bottom: 5vh; } .margin-bottom { margin-bottom: 5vh; } } /*淇℃伅鐩掑瓙*/ .info { font-size: 16px; color: #666666; line-height: 1.75em; } @media(max-width:1200px) { .info { font-size: 15px; } } @media(max-width:992px) { .info { font-size: 14px; } } /*鍐呴〉缈婚〉*/ .pagination{ margin: 30px 0 0; } .pagination>li>a { margin: 1px; padding: 8px 14px; border: none; font-size: 15px; color: #666; background: #222; border-radius: 0!important; transition: all .4s; } .pagination>li>a:hover { color: #138ce2; background: #222; } .pagination>li.on>a { color: #fff; font-weight: bold; background: #138ce2; } /*涓嬭浇*/ .down-nav{ margin-left: -15px; margin-right: -15px; margin-top: -15px; margin-bottom: 50px; font-size: 0px; text-align: left; overflow: hidden; } .down-nav li{ display: inline-block; width: 33.333%; padding: 15px; } .down-nav a{ display: block; height: 150px; border:1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.01); overflow: hidden; transition:all .4s; } .down-nav a span{ display: inline-block; margin-top: 30px; margin-left: 30px; font-size: 22px; color: #666; border-bottom: 2px solid #666; transition:all .4s; } .down-nav a img{ float: right; max-height: 140px; } .down-nav li.on a,.down-nav li:hover a{ border:1px solid #138ce2; background: rgba(255,255,255,0); box-shadow: 0 0 25px rgba(19,140,226,0.75); } .down-nav li.on a span,.down-nav li:hover a span{ color: #fff; border-bottom: 2px solid #fff; } @media(max-width:992px) { .down-nav li{ width: 50%; } } @media(max-width:768px) { .down-nav li{ width: 100%; padding: 10px 15px; } .down-nav a{ height: auto; box-shadow: 0 0 0px rgba(19,140,226,0.75); } .down-nav li.on a,.down-nav li:hover a{ border:1px solid #138ce2; box-shadow: none; } .down-nav a span{ display: inline-block; margin-top: 15px; margin-left: 20px; margin-bottom: 15px; font-size: 14px; color: #666; border-bottom: 2px solid #666; transition:all .4s; } .down-nav a img{ display: none; } } .download{ } .download li{ padding: 35px 0; color: #666; border-bottom: 1px solid rgba(255,255,255,0.1); overflow: hidden; } .download li:first-child{ border-top: 1px solid rgba(255,255,255,0.1); } .download li .down-img{ float: left; width: 22%; background: rgba(255,255,255,0.05); } .download li .down-content{ float: right; width: 73%; padding-left: 6%; } .download li h3{ color: #ccc; margin:10px 0px 15px; } .download li dl{ font-size: 16px; color: #4d4d4d; overflow: hidden; } .download li dd{ float: left; width: 50%; line-height: 30px; } .download li dt{ float: left; width: 100%; font-size: 16px; color: #4d4d4d; line-height: 30px; font-weight: normal; } a.down-btn{ display: inline-block; padding: 0px 25px; margin-top: 30PX; font-size: 16px; line-height: 46px; color: #666; border:1px solid RGBA(255,255,255,0.2); border-radius: 6px; } a.down-btn:hover{ color: #fff; background: #138ce2; border:1px solid RGBA(255,255,255,0.2); transition:all .4s; } a.down-btn span{ display: inline-block; margin-right: 6px; font-size: 22px; color: inherit; } @media(max-width:768px) { .download li .down-img{ float: none; width: 100%; max-width: 240px; margin: auto; background: rgba(255,255,255,0.05); } .download li .down-content{ float: none; width: 100%; padding-top: 6%; padding-left: 0%; } .download li dl{ font-size: 14px; } .download li dt{ font-size: 14px; } a.down-btn{ padding: 0px 20px; margin-top: 20PX; font-size: 14px; line-height: 36px; } } /*鏈嶅姟*/ .service-tab{ margin-bottom: 40px; text-align: center; border-bottom: 1px solid rgba(255,255,255,0.1); } .service-tab li{ display: inline-block; margin:0 25px; } .service-tab li a{ position: relative; display: inline-block; font-size: 24px; line-height: 70px; color: #999; transition:all .4s; } .service-tab li.active a{ color: #138ce2; } .service-tab li a:after{ content:""; position: absolute; z-index:1;bottom: 0px;left: 50%;width: 0%;height: 2px;background-color:#138ce2;transition:all .4s;} .service-tab li.active a:after{ content:""; left: 0%;width: 100%;} @media(max-width:992px) { .service-tab li{ margin:0 15px; } .service-tab li a{ font-size: 17px; line-height: 60px; font-weight: bold; } } /*绀惧尯璇︽儏*/ .info-box{ display: flex; flex-wrap: wrap; } .info-main{ width: 72%; } .info-main .info{ padding: 40px; background:rgba(255,255,255,0.05); } .community-title h3{ font-size: 24px; line-height: 1.2em; color: #ccc; margin: 0 0 12px; } .community-title-bottom{ font-size: 13px; line-height: 16px; color: #666; overflow: hidden; } .community-title-bottom .pull-right span{ display: inline-block; margin-left: 20px; margin-right: 4px; font-size: 14px; } .community-title hr{ border-top:1px solid rgba(255,255,255,0.2); margin: 25px 0 30px; } .reply{ overflow: hidden; } .reply .reply-box{ margin-top: 32px; padding: 40px 40px 30px; background:rgba(255,255,255,0.05); overflow: hidden; } .reply .reply-box .reply-container{ width: 100%; height: 120px; padding:15px 20px; font-size: 14px; line-height: 20px; color: #999; outline:none; border: none; background:rgba(255,255,255,0.05); } .reply .reply-box .reply-btn{ display: inline-block; padding:8px 35px; font-size: 14px; line-height: 20px; color: #999; outline:none; border: none; background:rgba(255,255,255,0.05); margin-top: 15px; transition:all .4s; } .reply .reply-box .reply-btn:hover{ background:#138ce2; color: #fff; } .reply .reply-list{ margin-top: 32px; padding: 40px; background:rgba(255,255,255,0.05); overflow: hidden; } .reply .reply-list ul li{ position: relative; display: block; padding: 30px 0 30px 70px; border-bottom: 1px solid rgba(255,255,255,0.1); } .reply .reply-list ul li .avatar{ position: absolute; left: 0px; top: 30px; display: block; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; background:rgba(255,255,255,0.05); overflow: hidden; } .reply .reply-list ul li .avatar span{ display: inline-block; width: 100%; height: 100%; font-size: 40px; line-height: inherit; color: #999; text-align: center; } .reply-top{ margin:5px 0 15px; overflow: hidden; } .reply-username{ float: left; padding-right: 15px; font-size: 13px; line-height: 14px; font-weight: bold; color: #666; } .reply-date{ float: left; padding-left: 15px; font-size: 13px; line-height: 14px; color: #4d4d4d; border-left: 1px solid #333; } .reply-floor{ float: right; font-size: 13px; line-height: 14px; font-weight: bold; color: #4d4d4d; } .reply-list ul { counter-reset: compteListe; } .reply-list ul .reply-floor::before { counter-increment: compteListe 1; content: "# " counter(compteListe); color: #666; font-weight: bold; font: 13px 'mono'; } .reply-msg{ font-size: 13px; line-height: 20px; color: #666; } .info-aside{ width: 25%; margin-left: 3%; } .info-aside .aside-logo{ width:100%; padding:30px 20px 20px; text-align: center; background:rgba(255,255,255,0.05); } .info-aside .aside-logo img{ max-width: 190px; vertical-align: bottom; } .info-aside .aside-logo h3{ font-size: 16px; color: #999; } .info-aside .aside-logo span{ font-size: 13px; color: #4d4d4d; } .info-aside .aside-logo a{ display: inline-block; width: 100%; margin-top: 40px; font-size: 13px; line-height: 42px; color: #666; border-radius: 21px; background:rgba(255,255,255,0.05); transition:all .4s; } .info-aside .aside-logo a:hover{ background:#138ce2; color: #fff; } .aside-list{ width:100%; padding:30px 20px; margin-top: 18px; text-align: center; background:rgba(255,255,255,0.05); } .aside-list h3{ margin: 0px 0 15px; padding-bottom: 10px; font-size: 15px; line-height: 20px; color: #999; text-align: left; font-weight: bold; border-bottom:1px solid rgba(255,255,255,0.1); } .aside-list ul { counter-reset: compteListe; } .aside-list ul li{ position: relative; padding:15px 0px 15px 30px; border-bottom: 1px solid rgba(255,255,255,0.1); } .aside-list ul li::before { position: absolute; z-index: 1; left: 0px; top:15px; counter-increment: compteListe 1; content: counter(compteListe); color: #666; font: 13px ; width: 20px; height: 20px; line-height: 20px; text-align: center; border-radius: 50%; background:rgba(255,255,255,0.05); } .aside-list ul li a{ display: block; font-size: 13px; line-height: 20px; color: #666; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden; } @media(max-width:992px) { .info-main{ width: 100%; } .info-aside { width: 100%; margin-left: 0%; } .info { font-size: 14px; } .aside-logo{ display: none; } .aside-list{ margin-top: 32px; } } @media(max-width:768px) { .info-main .info{ padding: 25px; } .reply .reply-box,.reply .reply-list{ padding: 25px; } } /*鍏充簬鎴戜滑*/ .about{ background-image: url(../images/img-about.png); background-position: right top; background-repeat: no-repeat; } .about-title { position: relative; z-index: 1; } .about-title h3 { margin:90px 0 40px; font-size: 30px; font-weight: bold; color: #fff; } .about-title span { position: absolute; left: 0%; bottom: 36px; z-index: -1; margin: 0px; font-size: 72px; line-height: 1em; color: #138ce2; opacity: 0.6; } .about-text { display: flex; justify-content: space-between; } .about-l { display: block; width: 100%; padding-right: 12%; } .about-r { display: block; } .about-r li { padding: 20px; width: 100%; line-height: 1em; text-align: center; color: #ebebeb; } .about-r li:nth-of-type(1) { background: rgba(19,140,226,9); } .about-r li:nth-of-type(2) { background: rgba(19,140,226,0.75); } .about-r li:nth-of-type(3) { background: rgba(19,140,226,0.6); } .about-r li h4 { width: 100%; font-size: 18px; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden; } .about-r li h4 span { display: inline-block; margin-right: 6px; font-size: 30px; line-height: 0.9em; vertical-align: bottom; } @media(max-width:1200px) { .about-title h3 { margin:60px 0 40px; font-size: 26px; font-weight: bold; } .about-title span { font-size: 60px; } } @media(max-width:996px) { .about-title h3 { margin: 60px 0 40px; } .about-text { display: flex; flex-wrap: wrap; justify-content: space-between; } .about-l { width: 100%; padding-right: 0%; } .about-r { width: 100%; display: block; } .about-r ul { display: flex; } .about-r li { width: auto; max-width: 33.3333%; display: inline-block; float: left; } } /*浼佷笟鑽h獕*/ .honor { display: flex; flex-wrap: wrap; margin-left: -8px; margin-right: -8px; } .honor-list { padding: 8px; } .honor-list a { position: relative; display: flex; align-items: center; width: 100%; height: 100%; background: #f5f5f5; overflow: hidden; } .show-img { display: flex; align-items: center; justify-content: center; overflow: hidden; } .show-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; transition: all ease .4s; } .honor-list a:hover .show-img img { transform: scale(1.2); } .show-name { position: absolute; z-index: 1; bottom: 0; left: 0; width: 100%; padding: 10px 15px; font-size: 13px; line-height: 24px; color: #fff; background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 100%); text-shadow: 1px 1px 3px rgba(0,0,0,0.75); white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; transition: all ease .4s; } /*浜у搧*/ .product-list{ display: flex; flex-wrap: wrap; margin-left: -8px; margin-right: -8px; } .product-list li{ width: 25%; padding: 8px; } .product-list li>div{ position: relative; width: 100%; height: 100%; background:radial-gradient(farthest-corner at 100% 0%, rgba(255,255,255,0.1),rgba(255,255,255,0.02), rgba(255,255,255,0.02)); box-shadow: 0 0 0px rgba(0,0,0,0); overflow: hidden; transition:all ease .5s; } .product-list li>div:hover{ background:radial-gradient(farthest-corner at 100% 0%, rgba(19,140,226,0.1),rgba(19,140,226,0.02), rgba(19,140,226,0.02)); box-shadow:0 0 25px rgba(19,140,226,0.75); transition:all ease .5s; } .product-list li .product-list-t{ position: absolute; z-index: 1; left: 0; top:0; display: block; padding: 0px 20px; margin-top: 15px; font-size: 18px; font-weight: bold; line-height: 24px; color: #999; text-align: center; transition:all ease .5s; } .product-list li>div:hover .product-list-t{ color: #138ce2; } @media(max-width:1600px) { .product-list li{ padding: 10px; } } @media(max-width:1200px) { .product-list li{ width: 33.333%; padding: 10px; } } @media(max-width:992px) { .product-list li{ width: 50%; } } @media(max-width:768px) { .product-list{ margin-left: -15px; margin-right: -15px; } .product-list li{ padding: 6px; } } /*浜у搧璇︽儏*/ .product-img{ width: 35%; float: left; } .product-text{ width: 55%; float: right; font-size: 15px; line-height: 2em; color: #666; } .product-text h2{ font-size: 30px; color: #ccc; margin-bottom: 30px; } .product-text hr{ margin: 25px 0 25px; border:none; border-top:1px dashed rgba(255,255,255,0.2); } .product-text p{ margin: 0px; } .product-buttom{ margin-top: 40px; } .product-buttom a{ position: relative; display: inline-block; min-width: 160px; padding:0 15px; font-size: 16px; line-height:42px; color: #666; text-align: center; border-radius: 4px; border:1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.02); } .product-buttom a:hover{ color: #fff; background: #138ce2; border:1px solid #138ce2; } .product-buttom a>div{ position: absolute; z-index: 1; left: 0; top: 0; width: 100%; background: #138ce2; color: #fff; opacity: 1; visibility: visible; transition:all ease .4s; } .product-buttom a:hover>div{ opacity: 0; visibility: hidden; } .product-buttom a.call{ border: 1px solid #138ce2; margin-right: 20px; } .product-buttom a.call p{ display: inline-block; margin: 0; font-size: 18px; color: #fff; vertical-align:top; } .product-details{ width: 100%; float: left; } .product-details hr{ margin: 40px 0 40px; border:none; border-top:1px dashed rgba(255,255,255,0.2); } @media(max-width:1600px) { .product-img{ width: 40%; } .product-text{ width: 50%; } } @media(max-width:1200px) { .product-img{ width: 45%; } .product-text{ width: 45%; font-size: 14px; line-height: 1.8em; } } @media(max-width:992px) { .product-img{ width: 100%; float:none; } .product-text{ margin-top:50px; width: 100%; float:none; text-align: center; } .product-details{ float: none; } .feedback-img{ display: none; } } @media(max-width:768px) { .product-text{ padding: 0px 5%; margin-top:40px; } .product-buttom a{ min-width: 120px; line-height:38px; } .product-buttom a.call span{ display: inline-block; font-size: 16px; color: #fff; vertical-align:top; } } /*淇℃伅鍥剧墖*/ .info-bg { padding: 10vh 0px; background-position: center; background-attachment: fixed; background-size: cover; } .info-bg>div { width: 92%; max-width: 1200px; margin: auto; padding: 50px; background: rgba(255,255,255,0.6); font-size: 16px; line-height: 1.75em; } /*绀惧尯鏂囩珷鍒楄〃*/ .community-list{ } .community-list li{ display: flex; padding: 40px 0px; border-top:1px solid rgba(255,255,255,0.05); } .community-list li:last-child{ border-bottom:1px solid rgba(255,255,255,0.05); } .community-list li .community-list-l{ width: 32%; padding-right: 6%; } .community-list li .community-list-r{ width: 68%; } .community-list li .community-list-r .community-list-t{ display: inline-block; margin: 5px 0; font-size: 18px; color: #ccc; transition:all .4s; } .community-list li .community-list-r small{ display: block; margin: 0 0 20px; font-size: 13px; color: #4d4d4d; } .community-list li .community-list-r p{ font-size: 13px; line-height: 2em; color: #666; } .community-list li .more{ font-size: 13px; line-height: 2em; color: #ccc; font-weight: bold; transition:all .4s; } .community-list li .community-list-r a:hover{ color: #138ce2; } /*鏂伴椈鍒楄〃*/ .news-list { display: flex; flex-wrap: wrap; } .news-list li { width: 32%; margin-right: 2%; margin-bottom: 2%; box-shadow: 0 0 0 rgba(0,0,0,0); background: rgba(255,255,255,0.05); transition: all ease .4s; } .news-list li:hover { box-shadow: 0 0 30px rgba(0,0,0,0.5); transform:translate(0%,-15px); } .news-c { padding: 30px; } .news-list li>div { width: 100%; } .news-title { display: block; font-size: 18px; line-height: 24px; color: #333; transition: all ease .4s; } .news-list li .news-title { width: 100%; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; margin: 5px 0 15px; color: #999; } .news-list li .news-title:hover { color: #138ce2; } .news-list li p { font-size: 13px; line-height: 22px; height: 44px; color: #666; display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .news-list li hr { margin: 20px 0px; border-color: rgba(255,255,255,0.2); } .news-time { text-align: center; overflow: hidden; } .news-time strong { display: block; font-family: Impact; font-size: 36px; line-height: 1em; font-weight: normal; white-space: nowrap; color: #4d4d4d; transition: all ease .4s; } .news-time span { font-family: Impact; display: block; font-size: 12px; line-height:30px; white-space: nowrap; color: #4d4d4d; transition: all ease .4s; } .news-list li .news-time { display: block; } .news-list li .news-time>div { float: left; padding: 0px 10px; } .news-list li .news-time>a.news-more { float: right; margin-right: 10px; } .news-list li .news-time>a.news-more span{ font-size: 30px; line-height:50px; } @media(min-width:992px) { .news-list li:nth-of-type(3n) { margin-right: 0%; } } @media(max-width:992px) { .news-list li { width: 49%; } .news-list li:nth-of-type(2n) { margin-right: 0%; } } @media(max-width:768px) { .news-list li { width: 100%; margin-right: 0%; margin-bottom: 20px; } .news-c { padding: 20px; } } /*鏂伴椈涓績*/ .news-center { width: 96%; max-width: 1200px; padding: 40px; margin: auto; font-size: 15px; line-height: 1.75em; background: #f7f7f7; } .news-head { border-bottom: 1px dashed rgba(255,255,255,0.1); margin-bottom: 40px; } .news-head h2 { font-size: 24px; font-weight: bold; color: #999; } .news-head p { margin-bottom: 15px; font-size: 12px; color: #666; } .new-page { padding: 20px 0px; margin: 40px auto 0px; font-size: 0px; text-align: center; border-top: 1px dashed rgba(255,255,255,0.1); } .new-page a { display: inline-block; padding: 0px 15px; font-size: 14px; line-height: 20px; color: #808080; transition: all ease .3s; } .new-page a:hover { color: #138ce2; } a.return { border-left: 1px solid rgba(255,255,255,0.1); border-right: 1px solid rgba(255,255,255,0.1); } @media(max-width:768px) { .news-center { padding: 20px; } } /*鍔犵洘*/ .cooperation li { display: flex; padding: 10px 0px; margin: 25px 0; background: #f7f7f7; transition: all .3s; } .cooperation li:hover { background: #00a0e9; box-shadow: 0 0 15px rgba(0,0,0,0.3); } .cooperation li .cooperation-text { width: 80%; padding-left: 40px; color: #4d4d4d; transition: all .3s; } .cooperation li:hover .cooperation-text { color: #fff; } .cooperation li .cooperation-text h2 { font-size: 24px; color: inherit; } .cooperation li .cooperation-text p { font-size: 18px; line-height: 1.75em; color: inherit; } .cooperation li .cooperation-link { width: 20%; padding-top: 30px; text-align: center; } .cooperation li .cooperation-link a { display: inline-block; padding: 0px 25px; font-size: 16px; line-height: 36px; color: #333; background: #fff; border-radius: 18px; transition: all .3s; } .cooperation li .cooperation-link a:hover { color: #fff; background: #138ce2; } @media(max-width:992px) { .cooperation li { display: block; } .cooperation li:hover { background: #f7f7f7; } .cooperation li .cooperation-text { width: 100%; padding: 10px 30px; } .cooperation li:hover .cooperation-text { color: #4d4d4d; } .cooperation li .cooperation-link { width: 100%; padding: 15px 30px; text-align: left; } .cooperation li .cooperation-link a { color: #fff; background: #138ce2; } } /*鑱旂郴*/ #contact{ padding-bottom: 0px; } .contact { display: flex; flex-wrap: wrap; } .contact-box{ position: relative; padding-bottom: 10px; margin-bottom: 30px; } .contact-box:after{ content:""; position: absolute; z-index:-1;bottom: 0px;left: 0%;width: 50px;height: 2px;background-color:#138ce2;} .contact-box h3{ color: #ccc; } .contact-box small{ color: #999; } .contact-box span{ line-height: 20px; } .contact-text .info p { position: relative; padding-left: 40px; font-size: 16px; line-height:30px; color: #666; } .contact-text .info p i,.contact-text .info p em { position: absolute; z-index: 1; top: 0; left: 0; font-size:22px; line-height: 28px; color: #138ce2; } .contact-text .info p strong { position: absolute; z-index: 1; top: 0; left: 60px; display: inline-block; margin-right: 20px; } .feedback { width: 96%; margin: auto;} .feedback input{ background: #222; border:1px solid rgba(255,255,255,0.05); line-height:40px; width:100%; padding:0px 15px; margin:8px 0px;} .form-control{ border:1px solid rgba(255,255,255,0.05); line-height:44px; height: 44px; width:100%; padding:0px 15px; margin:10px 0px; border-radius: none; box-shadow: 0;} .feedback textarea{ background: #222; border:1px solid rgba(255,255,255,0.05); line-height:22px; width:100%; height:160px; padding:15px; margin:10px 0px; outline:none; box-shadow:none; overflow-x: hidden;} .feedback input:focus,.feedback textarea:focus{ border:1px solid #138ce2; } .feedback .submit{ display:inline-block; padding:0px 25px; background:#222; font-size:14px; line-height:36px; color:#999; margin:15px 0px;transition:all .3s;} .feedback .submit:hover{background:#138ce2; color: #fff} @media(min-width:992px) { .contact-text { width: 50%; padding-right: 3%; margin-bottom: 40px; } .contact-feedback { width: 50%; padding-left: 3%; margin-bottom: 40px; border-left: 1px solid rgba(255,255,255,0.1); } } @media(max-width:992px) { .contact-text,.contact-feedback { width: 100%; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px dashed rgba(255,255,255,0.1); } } /*鍦板浘*/ #map-canvas { height: 500px; width: 100%; margin: 0px; padding: 0px; opacity: 0.5; } .content-window-card { position: relative; box-shadow: none; bottom: 0; left: 0; width: auto; padding: 0; } .content-window-card p { height: 2rem; } .amap-icon img, .amap-marker-content img{ width: 25px; height: 34px; } .custom-info { border: solid 1px silver; } div.info-top { display: none; position: relative; background: none repeat scroll 0 0 #F9F9F9; border-bottom: 1px solid #CCC; border-radius: 5px 5px 0 0; } div.info-top div { display: inline-block; color: #333333; font-size: 14px; font-weight: bold; line-height: 31px; padding: 0 10px; } div.info-top img { position: absolute; top: 10px; right: 10px; transition-duration: 0.25s; } div.info-top img:hover { box-shadow: 0px 0px 5px #000; } div.info-middle { font-size: 12px; padding: 10px 15px; line-height: 20px; overflow: hidden; } div.info-bottom { height: 0px; width: 100%; clear: both; text-align: center; } div.info-bottom img { position: relative; z-index: 104; } .custom-info span { margin-left: 5px; font-size: 11px; } .info-middle img { float: left; margin-right: 6px; } /*鍦板浘*/