@charset "utf-8"; /* CSS Document */ @font-face {font-family: "Opensans-Regular";src: url("../font/font.woff2");} @font-face {font-family:BarlowCondensed-Regular; src:url(../font/BarlowCondensed-Regular.ttf);} @font-face{font-family:'din'; src: url('../font/din.OTF');} @font-face {font-family: roboto_l; src: url(../font/ROBOTO-LIGHT-10.TTF);} @font-face {font-family: Barlow-Bold; src: url(../font/Barlow-Bold.TTF);} @font-face{ font-family:LEMONMILK; src:url(../font/LEMONMILK-1.OTF);} @font-face {font-family: Humanist521BT;src: url("../font/Humanist521BT.TTF"); } body,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,p,form,img,select{margin:0; padding:0;} body{ color: #333; font-size:16px; background:#fff; font-family:"微软雅黑"; overflow-x:hidden;} a{text-decoration:none; color:#333;} a:hover{color:#06c;} ul,li{list-style:none;} .clear{clear:both;} img{border:0;} /*滚动条美化*/ body::-webkit-scrollbar { width: 10px !important; } body::-webkit-scrollbar-track { background-color: #f3f3f3; } body::-webkit-scrollbar-track-piece { background-color: #f3f3f3; -webkit-border-radius: 4px; } body::-webkit-scrollbar-thumb { background-color: #ddd; border: solid 1px #C0C0C0; border-radius: 4px; } body::-webkit-scrollbar-corner { background-color: #ddd; } body::-webkit-resizer { background-repeat: no-repeat; background-position: bottom right; } body::-webkit-scrollbar-thumb:hover { background-color: #F3F3E0; } ::-webkit-scrollbar { width: 15px; } /*图片放大*/ .picShow img:hover,.picShow a:hover img{transition:all 500ms ease-out 0s; -webkit-transform:scale(1.1); moz-transform:scale(1.1); -o-transform:scale(1.1); transform:scale(1.1); opacity:1;} .picShow img{transition:all 500ms ease-out 0s; } .main100{width: 90%; margin: auto; max-width: 1500px; min-width: 1200px; } .main{width:1240px; margin:auto;} .bg_hui{background:#f2f2f2; min-width:1200px;} .flex_space{display:flex;justify-content:space-between; flex-wrap:wrap;} .flex_start{display:flex;justify-content: flex-start;flex-wrap:wrap;} .t_center{display:flex; flex-direction:column; justify-content:center;align-items:center;} .t_left_center{display:flex; flex-direction:column; justify-content:center;} /*头部*/ .top{ width:100%; height:198px; background:url(../images/top_bg.jpg) no-repeat center top; } .top .logo{height:1rem;} .top .logo h1{font-size:.22rem; font-weight:normal; letter-spacing:1px; text-indent:.5rem; } .top .logo h3{font-size:.22rem; font-weight:normal; letter-spacing:1px; margin:.13rem 0 .1rem 0;} /*电话*/ .top .tel{ font-size:.26rem; color:#06c;display:flex; font-weight:bold; justify-content:center;align-items:center; font-family:din;} .top .tel i{margin-right:.1rem;font-size:.22rem;} /*下拉菜单*/ .navBox {width:100%; position:relative; z-index:999; background:#1e4183;} .navBox .nav{ height:60px;} .navBox .nav li {position: relative; width:12.5%;} .navBox .nav li>a {display: block;position: relative; height:100%; display:flex; justify-content:center;align-items:center;} .navBox .nav li>a .bg {background: #0bba91;position: absolute;left: 0px;bottom: 0px;width:100%;display: block;height:0;transition: 0.5s; opacity:0;visibility: hidden;} .navBox .nav li.curr>a .bg:after,.navBox .nav li.active>a .bg:after { content: ''; position: absolute; left: 3px; right: -3px; top: 0; bottom: 0; background: #0bba91; -webkit-transform: skew(-7deg); -moz-transform: skew(-7deg); -o-transform: skew(-7deg); -ms-transform: skew(-7deg); transform: skew(-7deg); opacity: 0.5; } .navBox .nav li>a .txt {position: relative;z-index: 2;font-size:17px;color:#fff; transition: 0.3s;} .navBox .nav li.active a .bg,.navBox .nav li.curr a .bg {height: 100%; opacity: 1; visibility: visible; } .navBox .nav li>a:hover .txt,.navBox .nav li.curr>a .txt{} /*.navBox .nav li.active{background:#0bba91;}*/ .subNavbox{width:100%;position:absolute; margin-top:0; top:100%;left:50%;background:#fff; -webkit-transform:translate(-50%,10px);-ms-transform:translate(-50%,20px);transform:translate(-50%,20px); border-radius:3px;padding:15px 15px;opacity:0; pointer-events:none; transition:all .3s;box-shadow:0 5px 50px rgba(0,0,0,.1);} .subNavbox:after{content:"";position:absolute;bottom:100%;left:50%;border-style:solid;margin-left:-7px;border-width:7px;border-color:transparent transparent rgba(255, 255, 255, 0.9)} .subNavbox p:not(:last-of-type){border-bottom:1px solid #ddd} .subNavbox a{display:block;position:relative;font-size:16px;padding:15px 0; -webkit-transition:color .3s cubic-bezier(.645,.045,.355,1);-ms-transition:color .3s cubic-bezier(.645,.045,.355,1);transition:color .3s cubic-bezier(.645,.045,.355,1); text-align: center; } .subNavbox a:before{content:"";position:absolute;top:7px;bottom:7px;left:-15px;width:3px;background: #0bba91;-webkit-transform:scaleY(0);-ms-transform:scaleY(0);transform:scaleY(0);-webkit-transition:-webkit-transform .3s cubic-bezier(.162,.85,.45,1);transition:transform .3s cubic-bezier(.162,.85,.45,1);} .subNavbox a.active,.subNavbox a:hover{color:#0bba91} .subNavbox a.active:before,.subNavbox a:hover:before{-ms-transform-origin:top;-webkit-transform-origin:top;transform-origin:top;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)} .subNavbox.active{pointer-events:all;-webkit-transform:translate(-50%);-ms-transform:translate(-50%);transform:translate(-50%);-webkit-transition-delay:.1s;-ms-transition-delay:.1s;transition-delay:.1s;opacity:1; } /*搜索*/ .content_ss{margin-left:.4rem; width:3rem; height:.4rem;line-height:.4rem; border:solid 1px #e8e8e8; margin-top:.25rem;position: relative;border-radius: 36px;} .content_ss input[type="text"] { border: none; outline:none;width:1.8rem;display: block;height:.4rem;color: #333;font-size:.15rem;background: none; line-height:.4rem; padding: 0 0 0 .2rem; font-family: "Microsoft YaHei"; } .content_ss input[type="submit"] {position: absolute;right:.05rem;top: 0;background: url(../images/icon-sq2.png) center no-repeat;height:.4rem;width: .4rem; cursor: pointer;border: none; outline:none;} /*======================轮播图======================*/ /*焦点图*/ #banner {width:100%; position:relative; z-index:0; overflow:hidden;} /*#banner .txt{ position:absolute;z-index:9;left:6%;top: 50%;margin-top: -50px; height:100vh; text-shadow:rgba(0,0,0,0.5) 1px 1px 2px;}*/ #banner .txt{position:absolute;left:0;top:0; width:100%; height:100%; z-index:9; text-shadow:rgba(0,0,0,0.5) 1px 1px 2px;display:flex; justify-content:center;align-items:center;} #banner .txt h3{font-size:.5rem; color:#fff; margin-bottom:.2rem;} #banner .txt p{font-size:.25rem; color:#fff;} #banner .txt h3 {transform:translateY(200px);opacity:0;transition:all 0.3s;} #banner .txt p {transform:translateY(200px);opacity:0;transition:all 0.6s;} #banner .txt .viewmore {transform:translateY(200px);opacity:0;transition:all 0.9s; margin-top:50px;} #banner .swiper-slide-active .txt h3, #banner .swiper-slide-active .txt p, #banner .swiper-slide-active .txt .viewmore{transform:translateY(0px);opacity:1; transition-delay:0.8s;} .viewmore {position: relative; text-shadow:rgba(0,0,0,0) 1px 1px 2px;} .viewmore a{display: block;width: 110px;height: 46px;line-height: 46px;border: 1px solid rgba(255,255,255,.35); color:#fff;padding:0 25px;position: relative;transition:all 0.3s; } .viewmore a i{width: 20px;height: 20px;position: absolute;right: 15%;top: 50%;margin-top: -10px; background: url("../images/rb-1.png") center no-repeat;} .viewmore a:after { position:absolute; right:0; top:0; content: ""; width:0;background:rgba(255,255,255,.35);height:100%; transition:0.6s all;} .viewmore a:hover:after{width:100%; left:0;} #banner .swiper-slide .pic{height:500px;} #banner .swiper-slide .pic img{width:100%; height:100vh; transition: all 4s; transform: scale(1,1); -webkit-transform: scale(1,1); display:block; -webkit-filter: blur(30px); filter: blur(30px);} #banner .swiper-slide-active .pic img{transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1); -webkit-filter: blur(0px); filter: blur(0px);} /*按钮切换*/ #banner .swiper-button-prev,#banner .swiper-button-next {width: 72px;height: 72px; background: url(../images/ico_sliding.png) no-repeat; margin-top:-36px;opacity:0; transition:0.6s all;} #banner:hover .swiper-button-prev, #banner:hover .swiper-button-next{opacity:1;} #banner .swiper-button-prev {/*background-position: 0 0;*/ background-position: 0 -144px;} #banner .swiper-button-prev:hover { background-position: 0 -144px;} #banner .swiper-button-next { /*background-position: 0 -72px;*/ background-position: 0 -216px;} #banner .swiper-button-next:hover {background-position: 0 -216px;} /*分页器*/ #banner .swiper-pagination{bottom: 15px;} #banner .swiper-pagination-bullet {width: 38px;height: 3px;border-radius: 0;background: rgba(255, 255, 255, 1);opacity: 1;position: relative;margin: 0 5px !important;} #banner .swiper-pagination-bullet:before{content: "";position: absolute;top: 0;left: 0;background: #0bba91;width: 0;height: 3px;z-index: 1;transition: 0s;} #banner .swiper-pagination-bullet-active:before{width: 100%; transition: all 5s ease;} /*#banner .swiper-slide:before,.page_ban:before { content: ""; background: rgba(0,0,0,0) url(../images/header_bg.png) repeat-x left top; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 2; }*/ #banner .swiper-slide:after,.page_ban:after { content: ""; /*background:url(../images/banenr_line.png) rgba(0,0,0,0.5);*/ position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; opacity: .3; z-index: 3; } /*页面标题*/ .main_tit{ padding:50px 0 25px; } .main_tit_z{ font-size:.3rem; color:#111; } .main_tit_f{ font-size:.16rem; color:#888; text-transform:uppercase;} .main_tit a{ float:right; margin-top:10px; border-radius:20px; padding:6px 15px; font-size:13px; color:#888; border:solid 1px #ddd; background:#fff; transition:all 0.3s; } .main_tit a:hover{ background:#06c; border:solid 1px #06c;color:#fff;} /*页面标题2*/ .main_tit2{ padding:.6rem 0 .45rem; position:relative; text-align:center;} .main_tit2 h3{ font-size:.4rem; color:#111; font-weight:normal;} .main_tit2 h3:after {content: "";display: block;width: .2rem;background: #06c;height: 2px;margin: 16px auto 16px auto;} .main_tit2 h5{ font-size:.16rem; color:#888;text-transform:uppercase; font-weight:normal;} /*首页新闻*/ .ellipsis1 {overflow: hidden; text-overflow: ellipsis;white-space: nowrap;} .ellipsis2 {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;} .ellipsis3 {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;} /*新闻焦点图*/ #news_img{width:48.5%; margin:0; border-radius:5px; overflow:hidden;} #news_img .swiper-slide{position: relative;} #news_img .pic{ background:#fff; overflow:hidden; } #news_img .pic img{ width:100%; display:block; transition:0.6s all;} #news_img .txt{ position:absolute; left:0; bottom:0; width:78%; padding: 0 20% 0 2%; height:.5rem; line-height:.5rem; background:rgba(0,0,0,0.5);} #news_img .txt .tit {font-size:16px; color: #fff; overflow: hidden; text-overflow: ellipsis;white-space: nowrap; } #news_img:hover .pic img{transform: scale(1.1);} #news_img .swiper-pagination{text-align:right;bottom:15px;padding-right:10px; box-sizing:border-box;} #news_img .swiper-pagination-bullet { text-align:center; width:10px;height:10px; opacity: 1;background: rgba(255, 255, 255, 0.2); border-radius:10px; } #news_img .swiper-pagination-bullet-active { background: #fff;} /*===========新闻资讯右边新闻列表=======*/ .index_news_list{width:48.5%;} .index_news_list dl{display:flex;justify-content:space-between;} .index_news_list dl .date{width:108px; height:108px; border-radius:5px; background:#fff; border:solid 1px #ddd; transition:.5s; display:flex; justify-content:center;align-items:center; flex-wrap:wrap; position:relative;} .index_news_list dl .date span{ font-size:36px; display:block; margin-bottom:5px; font-weight:bold; color:#06c;} .index_news_list dl .date p{font-size:14px; text-align:center; position:relative; transition:.5s;} /*.index_news_list dl .date:before{ content:""; display:block; width:100%; height:0; position:absolute; left:0; bottom:0; z-index:0; background:#06c; transition:.5s;}*/ .index_news_list dl:hover .date{border:solid 1px #06c; background:#06c;} .index_news_list dl:hover .date:before{ height:100%; top:0; bottom:auto; } .index_news_list dl:hover .date p,.index_news_list dl:hover .date span{ color:#fff;} .index_news_list dl .txt{width:calc(100% - 125px); box-sizing:border-box; display:flex; align-content:center; justify-content:center; flex-direction:column;} .index_news_list dl .txt h3{font-size:.18rem; padding:0 0 .15rem 0;} .index_news_list dl .txt p{color:#888;line-height:2em; font-size:14px;} .index_news_list ul{ border-top:solid 1px #e8e8e8; margin-top:30px; padding-top:10px;} .index_news_list li{margin-top:20px; font-size:16px; background: url(../images/dot.gif) left center no-repeat; padding-left:15px;} .index_news_list li span{float:right; font-size:14px; color:#999;} /*产品分类*/ .pro_category{margin:50px auto 60px auto;} .pro_category li{width:32%; position:relative; transition:0.3s all; border-radius:5px; overflow:hidden;} .pro_category li .pic{ background:#000;} .pro_category li .pic img{ width:100%; display:block; opacity:1; transition:0.5s all;} .pro_category li:hover .pic img{opacity:0.8;} .pro_category li .txt{width:100%; height:100%; transition:0.5s all; color:#fff; position:absolute; left:0; top:0; display:flex; justify-content:center;align-items:center; font-size:25px;} .pro_category li:hover{ transform: translate3d(0, -15px, 0);-webkit-transform: translate3d(0, -15px, 0); box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 10px 0px;} /**/ .container02{ background:url(../images/container02_bg.jpg) no-repeat center bottom #F0F1F3; padding-bottom:70px; padding-top:15px;} .container02 .left{width:48%;} .container02 .right{width:48%;} .news_box{} .news_box .focus{ width:40%;} .news_box .focus .swiper-slide{position: relative; border-radius:5px; overflow:hidden;} .news_box .focus .pic{ background:#fff; overflow:hidden; } .news_box .focus .pic img{ width:100%; display:block; transition:0.6s all;} .news_box .focus .txt{ position:absolute; left:0; bottom:0; width:72%; padding: 0 25% 0 3%; height:36px; line-height:36px; background:rgba(0,0,0,0.5);} .news_box .focus .txt .tit {font-size:14px; color: #fff; overflow: hidden; text-overflow: ellipsis;white-space: nowrap; } .news_box .focus:hover .pic img{transform: scale(1.1);} .news_box .focus .swiper-pagination{text-align:right;bottom:10px; box-sizing:border-box;} .news_box .focus .swiper-pagination-bullet { text-align:center; width:8px;height:8px; opacity: 1; border:solid 1px #fff; background:none; border-radius:10px; } .news_box .focus .swiper-pagination-bullet-active { background: #06c; border:solid 1px #06c;} .news_box .list{ width:56%; display:flex; align-items:center; flex-wrap:wrap;} .news_box .list li{ font-size:16px;background: url(../images/dot.gif) left center no-repeat; padding-left:15px; width:100%; box-sizing:border-box;} .news_box .list li span{float:right; font-size:14px; color:#999; margin-left:10px;} /*快速导航*/ .ksdh{} .ksdh li{width:48.5%; position:relative; margin-bottom:15px; transition:0.3s all; border-radius:4px; overflow:hidden;} .ksdh li:hover{box-shadow: 0 8px 20px rgba(255, 255, 255, 0.3);translate3d(0, -3px, 0);-webkit-transform: translate3d(0, -3px, 0);} .ksdh li .pic{/*background:#000;*/ height:150px; overflow:hidden; position:relative;} .ksdh li .pic:before { content: ""; /*background: rgba(0,0,0,0.3);*/ position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 0; } .ksdh li .pic img{width:100%; height:100%; display:block; } .ksdh li .txt{ position:absolute; left:0; top:0; width:100%; height:100%; color:#fff; text-align:center; display:flex; justify-content:center; align-items:center; flex-wrap:wrap;} .ksdh li .txt .ico img{ height:.5rem;} .ksdh li .txt h5{ font-size:.2rem; font-weight:normal;} .container03{ margin-top:50px;} .container03 .item{ width:32%;} .container03 .tit {position:relative; margin-bottom:10px;} .container03 .tit .pic{overflow:hidden; } .container03 .tit img{width:100%; display:block; transition:0.3s all;opacity:1;} .container03 .tit .txt{ position:absolute; left:0; top:0; width:100%; height:100%; color:#fff;} .container03 .tit .txt h5{ font-size:.3rem; font-weight:normal; margin:25px 0 0 15px;} .container03 .tit .txt span{float:right;} .container03 .tit .txt span a{ float:right; margin:40px 10px 0 0; border-radius:20px; padding:5px 10px; font-size:12px; color:#fff; background:rgba(0,0,0,0.3); transition:all 0.3s; } .container03 .tit .txt span a:hover{ background:#163369; color:#fff;} .container03 .item ul{ padding:0 10px;} .container03 .item li{ font-size:15px;background: url(../images/dot.gif) left center no-repeat; padding-left:15px; box-sizing:border-box; line-height:50px;} .container03 .item li span{float:right; font-size:14px; color:#999; margin-left:10px;} /*图片列表*/ .pic_list{display: flex;justify-content: flex-start;flex-wrap:wrap;} .pic_list li{position:relative; overflow:hidden;margin-bottom:.2rem;} .pic_list li .pic{ background:#000; overflow:hidden; } .pic_list li img{width:100%; display:block; transition:0.3s all;opacity:1;} .pic_list li:hover img{opacity:1;} .pic_list li .txt{font-size:.17rem; text-align:center; line-height:.5rem;overflow: hidden; text-overflow: ellipsis;white-space: nowrap;} .pic_list_3 li{width: 31.5%; margin-right:2.7%;} .pic_list_4 li{width: 24%; margin-right:1.33%;} .pic_list_3 li:nth-child(3n), .pic_list_4 li:nth-child(4n){ margin-right:0;} /*================新闻列表=====================*/ .news_list{position:relative;} .news_list li{border-bottom:solid 1px rgba(204,204,204,0.5); margin-bottom:25px;} .news_list li a{display:flex;justify-content:space-between;} .news_list li .pic{overflow:hidden; width:30%; padding-bottom:25px;} .news_list li .pic img{width:100%; overflow:hidden;} .news_list li .txt{width:66%; padding:.1rem 0; box-sizing:border-box; position:relative;} .news_list li .txt h3{line-height:2em;font-size:20px; margin-bottom:15px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .news_list li .txt p{font-size:16px; line-height:2em; color:#666; } .news_list li .txt span{display:inline-block; color:#aaa;margin-top:.5rem;} /*================新闻列表2=====================*/ .art_list li{display:flex;justify-content:space-between; margin-bottom:30px; padding-bottom:40px; border-bottom:solid 1px #e8e8e8; transition:.5s;} /*.art_list li:hover{box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);translate3d(0, -3px, 0);-webkit-transform: translate3d(0, -3px, 0);}*/ .art_list li .date{width:100px; height:100px; background:#f2f2f2; transition:.5s; display:flex; justify-content:center;align-items:center; flex-wrap:wrap; position:relative;} .art_list li .date span{ font-size:36px; display:block; margin-bottom:5px; font-weight:bold; color:#06c;} .art_list li .date p{font-size:14px; text-align:center; position:relative; transition:.5s;} .art_list li .date:before{ content:""; display:block; width:100%; height:0; position:absolute; left:0; bottom:0; z-index:0; background:#06c; transition:.5s;} .art_list li:hover .date:before{ height:100%; top:0; bottom:auto;} .art_list li:hover .date p,.art_list li:hover .date span{ color:#fff;} .art_list li .txt{width:calc(100% - 125px); box-sizing:border-box; display:flex; align-content:center; justify-content:center; flex-direction:column;} .art_list li .txt h3{font-size:18px; padding:0 0 12px 0;} .art_list li .txt p{color:#666;line-height:2em; font-size:14px;} .news_tj{ margin-bottom:25px; height: 292px; position:relative;} .news_tj li{ margin-bottom:5px; padding-left: 51%;} .news_tj .pic{ position:absolute; width:49%; left:0; top:0; opacity:0;transition: all ease 0.3s;} .news_tj .pic img{width: 100%; display: block;} .news_tj .txt{ line-height:38px; height:38px; padding:0 10px 0 10px; position:relative;} .news_tj .txt .date{ font-size:14px; width:100px; display:inline-block; color:#999999;} .news_tj li:hover .txt,.news_tj li.on .txt{ background:#f5f5f5;} .news_tj li.on .pic{ opacity:1; z-index:10;} /*栏目分类*/ .cate_nav{} .cate_nav li{width:32%; margin-right:2%;margin-bottom:15px;} .cate_nav li:nth-child(3n){margin-right:0;} .cate_nav li .pic{ overflow:hidden;} .cate_nav li .pic img{width:100%; display:block; transition:0.6s all; } .cate_nav li .txt{ line-height:1.6; text-align:center;padding:20px 0;font-size:15px;} /*图文列表*/ .pic_art_list{display: flex;justify-content: flex-start;flex-wrap:wrap;} .pic_art_list li { background: #f6f6f6; box-sizing:border-box;margin-bottom:.4rem;position: relative;transition: ease 1s;} .pic_art_list li .pic{ background:#000; overflow:hidden; } .pic_art_list li img{width:100%; display:block; transition:0.6s all; } .pic_art_list li .txt {font-size:.14rem;padding:0 .2rem;color: #666666; } .pic_art_list li .tit {margin-top:.25rem;font-size:.2rem; line-height:1.6em; color: #000000;font-weight: bold;} .pic_art_list li .more { margin-top:.25rem;margin-bottom:.3rem; line-height: 28px;display: inline-block;} .pic_art_list li .more .en { font-style:normal;font-size: 14px;font-family: Humanist521BT;font-weight: bold;text-decoration: underline;color: #000000;margin-right: 10px;} .pic_art_list li .more .icon {display: inline-block;width: 28px;transition: ease .6s;height: 28px;background: url(../images/arr2.jpg) no-repeat center;vertical-align: middle;background-size: 100% 100%;} .pic_art_list li:hover .more .icon{ transform: rotate(45deg);} .pic_art_list li:hover .pic img{transform: scale(1.1);} .pic_art_list li::after {content: "";width: 0;border-bottom: 2px solid #06c;position: absolute;left: 50%;bottom: 0;z-index: 9;transition: 1s;} .pic_art_list li:hover::after{width:100%; left:0;} .col_3 li{width: 31.3%; margin-right:3%;} .col_4 li{width: 24%; margin-right:1.33%;} .col_3 li:nth-child(3n), .col_4 li:nth-child(4n){ margin-right:0;} /*友情链接*/ .Linkbox{ margin-bottom:.5rem;} .Linkbox li{width: 22%; } .Linkbox select{ width:100%; border:1px solid rgba(255,255,255,0.2); color:#fff; background:none; outline:none; height:36px;} .Linkbox select option{ color:#666;} /* 底部 */ .foot_bg{ width:100%; min-width:1200px; font-size:14px; background: url(../images/footer.png) no-repeat center bottom #1e4183; padding:.5rem 0 .6rem 0; margin-top:.8rem;} .footer_nav{width:63%;} .footer_nav h5{height:.5rem;} .footer_nav h5 a{font-size:16px;color:#fff;} .footer_nav h5:after {content: ""; display:block;width:.2rem; height: 2px; background: rgba(255,255,255,0.1);margin:.15rem 0 .2rem 0;} .footer_nav li{line-height:.36rem;} .footer_nav li a{color:rgba(255,255,255,0.6);} .footer_nav li a:hover{color:rgba(255,255,255,0.9); text-decoration:underline;} .b_contact{width:25%;} .b_contact h5{padding: 0 0 0 .3rem;font-size:16px; color: #fff; background: url(../images/icon_ren.png) left center no-repeat;margin-bottom:.2rem;} .b_contact h3 { font-size: .36rem; font-family: "din"; color: #fff; margin: .15rem 0 .15rem 0;} .b_contact p{ color:rgba(255,255,255,0.66); line-height:2em;} .b_contact .ico{margin-top:.25rem;} .b_contact .ico a{background:rgba(0,0,0,.2);border-radius:100px;color:rgba(255,255,255,.35);font-size:.2rem;display:inline-block;width:.46rem;height:.46rem;line-height:.46rem;text-align:center; margin:0 10px 0 0; transition:0.3s all;} .b_contact .ico a:hover{background:rgba(255,255,255,.1)} .foot_end{ width:100%; min-width:1200px; padding:.15rem 0; background:#163369; color:rgba(255,255,255,0.55); text-transform:uppercase; font-size:12px;} .foot_end span,.foot_end a{color:rgba(255,255,255,0.55); margin-left:.1rem;} .foot_end span{ float:right;} /*内页banner=*/ .page_ban{ width:100%; max-width:1920px; position:relative;min-width:1200px; overflow:hidden; color:#fff; background-position: center top; background-attachment:fixed; background-repeat:no-repeat; background-size:cover; animation: o-scale 20s linear infinite; } @keyframes o-scale { 0%,85%,100%{ background-size:100% auto; } 50%{ background-size:108% auto; } } .page_ban .pic img{width:100%; display:block; opacity: 1;} .page_ban .txt{position:absolute; left:0; top:0; bottom:0; right:0; display: flex; z-index:9; flex-direction:column; justify-content:center; align-items:center;} .page_ban .txt h5 { font-size: .6rem; font-weight:normal;color: #fff;text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);letter-spacing: 1px;font-family: LEMONMILK; margin-top:.5rem;} .page_ban .txt h3 { font-size: .5rem; font-weight:normal;color: #fff;text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);letter-spacing: 1px; } /*===================子栏目导航================*/ .sub_nav{border-bottom: 1px solid #dcdcdc; padding-bottom:20px;} .sub_nav li a{display: block;line-height: 48px;padding-left: 15px; background: url(../images/dotm1.gif) 0px center no-repeat;color: #666666; transition: all ease 0.3s;} .sub_nav li:hover a,.sub_nav li.active a{ padding-left:20px; background: url(../images/dotm2.gif) 0px center no-repeat;color: #000; font-size:20px;} /*位置*/ .pos{position: relative;border-bottom: 1px solid #dcdcdc;height:85px;color: #a8a8a8; margin-bottom: 30px;} .pos .weizhi{background:url(../images/home_ico.png) no-repeat left center; padding-left:25px; color:#666; font-size:14px; line-height:88px;} .pos .weizhi a{ color:#666;} .pos h2{font-size: .3rem;color: #333;border-bottom: 3px solid #0bba91; height: 84px; line-height:84px;} /*内页*/ .page_box{margin-top:40px;} .page_box .page_side{width:225px; border-right: 1px solid #dcdcdc; min-height:5rem; position:relative;} .page_box .main_box{width:calc(100% - 280px);} .page_box .page_side .tit{padding-bottom: 15px;border-bottom: 1px solid #dcdcdc;margin-bottom: 25px;} .page_box .page_side .tit h2{font-weight:normal; line-height:40px; font-size:.34rem; color:#000000;} .page_box .page_side .tit p{ line-height:30px; color:#999999; text-transform:uppercase;} .page_box .page_side .tit p i{color:#006acd; margin-right:4px; font-style:normal;} /*======================专家团队======================*/ .team_list{ margin-bottom:15px;} .team_list li{ border-bottom:solid 1px #e8e8e8; padding-bottom:30px; margin-bottom:30px;} .team_list li .pic{width:30%; overflow:hidden;} .team_list li .pic img{width:100%; display:block;} .team_list li .txt{ width:65%;} .team_list li .txt h5{font-size:18px; line-height:2em; margin-bottom:5px; } .team_list li .txt p{line-height:2em; text-align:justify; color:#666;} .job_list{} .job_list li{box-shadow: 0 5px 10px rgba(0,0,0,0.0); border:solid 1px #eee; padding:20px 25px; border-radius:5px; margin-top:20px;} .job_list li:last-child{ background:#f6f6f6;} .job_list li .tit{ text-align:center;} .job_list li .tit h3{ font-size:20px; display:inline-block; padding:0px 50px; background:#0bba91; line-height:46px; border-radius:50px; color:#fff; position:relative;} /*.job_list li .tit h3:after{content:''; width:10px; height:10px; border-radius:100%; background:#0bba91; position:absolute; left:-25px; top:20px;}*/ /*.job_list li .tit h3:before{content:''; width:10px; height:10px; border-radius:100%; background:#0bba91; position:absolute; right:-25px; top:20px;}*/ .job_list li .txt{line-height:2;} .job_list li .txt h5{ font-size:18px; margin:20px 0 8px 0;} .job_list li .txt p{ margin-bottom:5px;} /*show*/ .show_main{} /*文章标题*/ .title_txt {font-size:28px;line-height:1.8em; font-weight:bold; text-align:center; } .art_info{line-height:.6rem; font-size:14px; margin-bottom:35px; color:#999; border-bottom: solid 1px #e8e8e8; text-align:center; position:relative;} .art_info em{margin-right:.2rem; display:inline-block; font-style:normal;} /*正文*/ #art_box { font-size:17px; text-align:justify; } #art_box p {line-height:2;margin-bottom:.2rem; } #art_box p img{ max-width:800px;} #art_box a{color:#0000FF;} #art_box table{ border:1px solid #eff3f8; border-collapse:collapse; font-size:14px; line-height:24px;text-align:center;} #art_box table tr:nth-child(1){ font-size:14px; background:#eff3f8; font-weight:bold;} #art_box table td{padding:5px 10px; border:1px solid #D5DFEC;} #art_box table td:nth-child(2){text-align:left;} /*分享按钮*/ .shart_box{ display:inline-block; position:absolute; right:0; top:10px;} #j_shart_s_24 .bds_count{ font-size:.13rem;} #j_shart_s_24{ padding-left:60px; position:relative;} #j_shart_s_24 strong{display:block;position:absolute;left:0;z-index:2;line-height:36px;font-size:12px;color: #a3a0a9;font-weight: normal;} #j_shart_s_24 .bds_qzone{background:url(../images/j_shart.png) center -224px no-repeat} #j_shart_s_24 .bds_tsina{background:url(../images/j_shart.png) center -311px no-repeat} #j_shart_s_24 .bds_tqq{background:url(../images/j_shart.png) center -195px no-repeat} #j_shart_s_24 .bds_renren{background:url(../images/j_shart.png) center -340px no-repeat} #j_shart_s_24 .bds_weixin{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_sqq{background:url(../images/j_shart.png) center -79px no-repeat} #j_shart_s_24 .bds_fbook{background:url(../images/j_shart.png) center -166px no-repeat} #j_shart_s_24 .bds_twi{background:url(../images/j_shart.png) center -137px no-repeat} #j_shart_s_24 .bds_linkedin{background:url(../images/j_shart.png) center -108px no-repeat} #j_shart_s_24 .bds_tieba{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_huaban{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_douban{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_copy{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_print{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_mshare{background:url(../images/j_shart.png) center -253px no-repeat} #j_shart_s_24 .bds_count{font-size:12px} /*返回*/ .Back{ text-align: center; } .Back a{ background: url(../images/back.png) no-repeat center top; text-align: center; display: inline-block; margin: 0px auto; height: 90px; width: 176px; font-size: 14px; line-height: 24px; padding-top: 75px; color: #FFF; transition:0.3s all;} .Back a:hover{transform:translateY(-10px); color:#fff;} /*相关阅读*/ .xg_art{} .xg_art h5{font-size:.22rem; margin:.5rem 0 .25rem 0;} /*内容右侧*/ .show_side .tit{font-size:.25rem; margin-bottom: .2rem;} .show_side .serch{ position:relative; margin-bottom:.5rem;} .show_side .serch input{ outline:none;} .show_side .serch input[name=keyword]{ border:solid 0px #e8e8e8; background:#fff; width:82%; height:.56rem; font-size:.16rem; padding:0 .2rem; box-sizing:border-box;} .show_side .serch input[type=submit]{ position:absolute; cursor:pointer; right:0; top:0; height:.56rem; width:18%;border:0; background: url(../images/icon-hsrch.png) no-repeat center #0bba91;} .show_side .swiper-container{ position:relative;} .show_side .button-next{ float:right; outline:none;color: #7e7e7e;cursor:pointer;margin-top:5px;} .show_side .swiper-container li a { display: block; width:100%; overflow: hidden; margin-bottom:.2rem;padding-bottom:.2rem; border-bottom:dotted 1px #ccc; } .show_side .swiper-container li a .time { font-size: .14rem; color:#666; font-family:roboto_l; margin-top:.1rem; margin-bottom:.05rem;} .show_side .swiper-container li a .time i{font-size:.12rem; margin-right:.05rem;} .show_side .swiper-container li a h4 { font-size:.17rem; font-weight:normal; line-height:2em; } /*系统表单样式*/ .portlet-body{ background:#f8f8f8; border-radius:5px;} .portlet-body .form-group{margin-bottom:10px;} .portlet-body .form-horizontal{ padding:50px 80px;} .portlet-body .form-horizontal input{border:solid 1px #ccc; border-radius:5px; height:36px; line-height:36px; font-size:15px; color:#666; padding:0 10px; margin-top:5px; box-sizing:border-box; outline:none;} .portlet-body .form-horizontal textarea{border:solid 1px #ccc; border-radius:5px; line-height:36px; font-size:15px; color:#666; padding:0 10px; margin-top:5px; box-sizing:border-box; outline:none;} .portlet-body .form-horizontal .btn{width:128px; height:40px; line-height:40px; background:#0085c3; color:#fff; border:none; border-radius:5px; cursor:pointer; outline:none; transition:0.3s all;} .portlet-body .form-horizontal .btn:hover{ background:#f60; color:#fff; text-decoration:none;} /*======================产品内容页======================*/ .img_center {position: absolute;display: block;left: 0;top: 0;bottom: 0;right: 0;margin: auto;} /*图片垂直居中样式*/ .show_pro{ background:#fff; } .pro_box1{display:flex; justify-content:space-between;} .pro_box1 .left{width:50%; } .pro_box1 .right{width:45%;} .pro_box1 .right h1{font-size:.3rem;color:#111;line-height:1.6em; } .pro_box1 .right .txt{line-height:2em; font-size:.16rem; margin:.2rem 0 .25rem 0; text-align:justify;} /* 产品大图 */ .thumb-wrapper {border: 1px solid #eee; height:318px; position:relative;} .thumb-wrapper img{max-width:100%; max-height:100%;} /*产品缩略图轮播*/ .swiper-adv-father {width: 100%; position: relative;margin-top:.15rem;} .swiper-adv-father .swiper-container {width: 100%; padding:0 20px; box-sizing:border-box;} .swiper-adv-father .slide-item {width:76px; height:70px;border: 0px solid #eee; background:#000; margin: 0 auto;cursor: pointer; position:relative;} .swiper-adv-father .selected .slide-item{border: 0px solid #f60;} .swiper-adv-father .slide-item img{max-width:100%; max-height:100%; opacity:0.6; transition:0.3s all;} .swiper-adv-father .selected .slide-item img{opacity:1;} .swiper-adv-father .data-adv-prev {width: 18px;height: 30px;background-size: 14px 24px;background-image: url('../images/adv-left-icon.png') !important;top: 62%;left: 0;z-index: 1;outline: none;} .swiper-adv-father .data-adv-next {width: 18px;height: 30px;background-size: 14px 24px;background-image: url('../images/adv-right-icon.png') !important;top: 62%;right: 0;z-index: 1;outline: none;} #pro_thumb .swiper-button-prev{width: 18px;height: 30px;background-size: 14px 24px;background-image: url('../images/adv-left-icon.png') !important;top: 62%;left: 0;z-index: 1;outline: none;} #pro_thumb .swiper-button-next{width: 18px;height: 30px;background-size: 14px 24px;background-image: url('../images/adv-right-icon.png') !important;top: 62%;right: 0;z-index: 1;outline: none;} /* box */ div.zoomDiv{z-index:999;position:absolute;top:0px;left:0px;width:200px;height:200px;background:#ffffff;border:1px solid #CCCCCC;display:none;text-align:center;overflow:hidden;} div.zoomMask{position:absolute;background:url("../images/mask.png") repeat scroll 0 0 transparent;cursor:move;z-index:1;} /*按钮*/ .pro_box1 .right .ft{ margin-top:.5rem;} .pro_box1 .right .ft li{display: inline;} .pro_box1 .right .ft li a{width:1.8rem;height:.56rem; background:#06c; display: block;text-align: center;line-height:.56rem; font-size:.18rem; color:#fff; transition:0.3s all;} .pro_box1 .right .ft li a:hover{ background:#0bba91; width:2rem;} /*联系方式*/ .page_contact{ } .page_contact p{ line-height: 2em; padding-left:30px; margin-bottom:10px;} /*留言反馈*/ .n_contact{} .n_contact .main_box{ width:60%;} .n_contact .pic{ width:36%; position:relative;} .n_contact .pic img{width:100%; position:absolute; right:0; bottom:0;} /*表单*/ .biaodan ul{display:flex; justify-content:space-between; flex-wrap:wrap;} .biaodan li{font-size:.15rem; margin-bottom:.15rem; width:49%;} .biaodan li:last-child{ margin-bottom:0;} .biaodan input{padding:15px;width:100%; box-sizing:border-box; border: 1px solid rgba(0,0,0,.2); background:#f8f8f8; border-radius:3px; font-size:.16rem;} .biaodan textarea{padding:.2rem;width:100%; box-sizing:border-box;border: 1px solid rgba(0,0,0,.2); height:125px; background:#f8f8f8; border-radius:3px; font-size:.16rem; font-family:"微软雅黑";} .biaodan .form-group {width:100%;} .biaodan .form-group input{width:49%; margin-right:1%; margin-bottom:.2rem;} .biaodan .submit{ border:none; font-size:.2rem; cursor:pointer; text-align:center; color:#fff; background:#0bba91; border-radius: 3px; transition:0.3s all; width:100%; height:.6rem; line-height:.6rem;} .biaodan .submit:hover{ background:#ff4444; color:#fff; text-decoration:none;} /*弹窗*/ .tc{transition:all ease 300ms;position: fixed;width: 100%;height: 100%;top: 0;left: 0;z-index: 99999;} .tc{ pointer-events: none; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0;transform:scale(1.1);} .tc.act{ filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; pointer-events: auto;transform:scale(1);} .tc-bg {height: 100%;background: rgba(0,0,0,.8);position: absolute;top: 0;left: 0;width: 100%;z-index: 0;} .buy_form{width:10rem; height:7rem; padding:.5rem .8rem; background:#fff; box-sizing:border-box; position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; margin:auto;} .buy_form .close{position:absolute; top:40px; right:40px; cursor:pointer;} .buy_form .tit{font-size:.4rem; color:#000; margin-bottom:.1rem} .buy_form .info{ line-height:2em; font-size:.16rem; color:#888; border-bottom:solid 1px #ddd; height:.5rem; margin-bottom:.35rem;} .buy_form ul{display:flex; justify-content:space-between; flex-wrap:wrap;} .buy_form li{font-size:.15rem; margin-bottom:.15rem; width:49%;} .buy_form input{padding:.2rem;width:100%; box-sizing:border-box; border: 1px solid rgba(0,0,0,.1); border-radius: 2px; font-size:.16rem; } .buy_form textarea{padding:.2rem;width:100%; box-sizing:border-box;border: 1px solid rgba(0,0,0,.1); height:125px; border-radius: 2px; font-size:.16rem; font-family:"微软雅黑";} .buy_form .form-group {width:100%;} .buy_form .form-group input{width:49%; margin-right:1%; margin-bottom:.2rem;} .buy_form .submit{ border:none; font-size:.2rem; cursor:pointer; text-align:center; color:#fff; background:#06c; border-radius: 3px; transition:0.3s all; width:100%; height:.6rem; line-height:.6rem;} .buy_form .submit:hover{ background:#ff4444; color:#fff; text-decoration:none;} /*上一篇下一篇*/ .ctrl{margin-top:25px; display: flex;justify-content: space-between; background-color: #e7e7e7;} .ctrl a { display:inline-block; line-height:76px; width:47%; box-sizing: border-box; transition: 0.3s; overflow: hidden; text-overflow:ellipsis;white-space: nowrap;} .ctrl a:first-child{padding-left:25px;} .ctrl a:last-child{padding-right:25px;} /*内页分页*/ .search-pagination{text-align:center; margin:15px 0 20px 0;} .pagination li {display: inline-block;margin:0 3px;} .pagination li a{display: inline-block;font-size: 15px; border-radius:3px;min-width: 46px;height: 46px;line-height: 46px; box-sizing: border-box; padding:0 20px; box-sizing:border-box;transition: 0.3s; background:#e8e8e8; border:solid 0px #ddd;} .pagination li.active a,.pagination li a:hover{color: #fff !important;background-color:#06c;border:solid 0px #004d98;} /*404*/ .page_msg {padding: 50px;} .page_msg h5 { line-height: 60px;border-bottom: 1px solid #ddd;margin-bottom: 10px; font-size:25px; text-align:center;} .page_msg_con {color: #999; line-height:40px; text-align:center;padding: 25px 0;} .page_msg_con i {font-size:100px;color: #ddd; margin-bottom:10px;} /*搜索页面*/ .serch_n{ width:6rem; position:relative; margin:0 auto .3rem auto;} .serch_n input{width:100%; padding:0 .15rem; font-size:.25rem; outline:none; background:#e8e8e8; box-sizing:border-box; height:.7rem; line-height:.7rem; border:solid 0px #ddd;} .serch_n .btn{ position:absolute; right:0; top:0px;} .serch_n .btn button{ width:1.5rem; height:.7rem; border:0; cursor:pointer; outline:none; padding-left:40px; font-size:.22rem; color:#fff; background: url('../images/icon-hsrch.png') no-repeat 20px center #DA251E; background-size:20px auto;} .portlet-title{ height:.5rem; line-height:.5rem; border-bottom: 1px solid #eee; display: flex;justify-content: space-between; margin:.3rem 0;} .portlet-title h5{font-size:.25rem; position:relative; float:left; padding:0 5px;} .portlet-title h5:after{content: "";position: absolute;width:100%; height: 2px;left: 0;bottom: -1px;background:#DA251E;} /*==========查看更多通用===============*/ .lookmore{ text-align:center; margin:.4rem auto;} .lookmore a{display:inline-block;border: #ddd 2px solid; border-radius:.5rem;width:2.2rem; font-size:.16rem; line-height:.45rem; color: #333; background:#fff; position:relative;overflow:hidden; transition:0.5s all;} .lookmore a span{ position:relative; z-index:10} .lookmore a:hover{color:#fff;border:#DA251E 2px solid;background: #DA251E; transition-delay:0.36s} @-webkit-keyframes criss-cross-left { 0% { left: -20px; } 50% { left: 50%; width: 20px; height: 20px; } 100% { left: 50%; width: 375px; height: 375px; } } @keyframes criss-cross-left { 0% { left: -20px; } 50% { left: 50%; width: 20px; height: 20px; } 100% { left: 50%; width: 375px; height: 375px; } } @-webkit-keyframes criss-cross-right { 0% { right: -20px; } 50% { right: 50%; width: 20px; height: 20px; } 100% { right: 50%; width: 375px; height: 375px; } } @keyframes criss-cross-right { 0% { right: -20px; } 50% { right: 50%; width: 20px; height: 20px; } 100% { right: 50%; width: 375px; height: 375px; } } .btn-11 {position: relative;color: #DA251E;} .btn-11:before, .btn-11:after {position: absolute;top: 50%;content: '';width: 20px;height: 20px;background: #DA251E;border-radius: 50%;} .btn-11:before {left: -20px;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);/* animation: criss-cross-left 0.8s reverse; */} .btn-11:after {right: -20px;-webkit-transform: translate(50%, -50%);transform: translate(50%, -50%);/* animation: criss-cross-right 0.8s reverse; */} .btn-11:hover:before, .btn-11:hover:after {/* @include size($btn-width); */} .btn-11:hover:before {-webkit-animation: criss-cross-left 0.8s both;animation: criss-cross-left 0.8s both;} .btn-11:hover:after {-webkit-animation: criss-cross-right 0.8s both;animation: criss-cross-right 0.8s both;} /*向上*/ .cd-top { display: inline-block; height: .52rem; width: .52rem; position: fixed; z-index:99999; bottom: 40px; right: 5px;border-radius: 50%; /* image replacement properties */ overflow: hidden; text-indent: 100%; white-space: nowrap; background: rgba(0, 0, 0, 0.2) url(../images/cd-top-arrow.svg) no-repeat center 50%; visibility: hidden; opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .cd-top.cd-is-visible { /* the button becomes visible */ visibility: visible; opacity: 1; } .cd-top.cd-fade-out { /* 如果用户继续向下滚动,这个按钮的透明度会变得更低 */ opacity: .5; } .no-touch .cd-top:hover { background-color: #0bba91; opacity: 1; } @media only screen and (min-width: 768px) { .cd-top { right: 10px; bottom: 50px; } } @media only screen and (min-width: 1024px) { .cd-top { right: 5px; bottom: 50px; } } .cd-top:hover{background-color:#0bba91;transition: all 0.3s ease 0s;}