﻿@charset "utf-8";html{overflow-y:scroll;}
body{margin:0px;padding:0px;color:#484848;font-family:stheiti,Arial;font-size: 14px; background:#FFF}
ul,li,dl,dd,dt{margin:0px;padding:0px;list-style:none;}
html, body, div, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, select, button, textarea, iframe, table, th, td{margin: 0;padding: 0;font-weight:normal}
p{margin:0px;padding:0px;}
img{border:none;padding:0;margin:0;vertical-align:middle;}
a{text-decoration:none;font-weight:normal;color: #484848;}
a:hover{color: #484848;font-weight:normal}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.l{ float:left;}
.r{ float:right}

.header {background: #313131;}
.header .content{width: 100%;background: #313131;max-width:1176px;min-width:980px; margin:0 auto}
.header .content .logo{width:110px; padding-top:24px;display: block; float:left}
.header .content .logo img{ width:100%}
.header .content .navBar{ float:right;position: relative; z-index: 1;}
.header .content .nav{}
.header .content .nav .m{ float:left;position:relative;margin-left:-1px;   }
.header .content .nav h3{ float:left; font-size:100%; font-size:16px; height:95px;line-height:95px;}
.header .content .nav h3 a{ display:block; color:#fff;  padding:0 36px; vertical-align:top;  }
.header .content .nav .on{ border:0;}
.header .content .nav .on h3 a{color:#fff; font-weight:bold; }
.header .content .nav .sub{display:none;width:100%;position:absolute; left:0;top: 70px; background:#fff; padding:10px 0px}
.header .content .nav .sub li{ height:40px; line-height:40px; width:100%;}
.header .content .nav .sub li a{display:block; padding-left:6px; font-size:16px; text-align:center}
.header .content .nav .sub li a:hover{ color:#0088be;}
.header .content .nav .sub:before{display:block; content:'';border-width:6px 6px 6px 6px;border-style:solid;border-color:transparent transparent #fff transparent;position:absolute;left:45%;top:-12px;}

.banner{ min-width:1000px;  position:relative;  height:465px; overflow:hidden;}
.banner .bd{ position:relative; z-index:0;  }
.banner .bd ul{ width:100% !important; }
.banner .bd li{ width:100% !important;  height:465px; }
.banner .bd li a{height:465px; display:block;min-width:980px;}
.banner .hd{ width:100%;  position:absolute; z-index:1; bottom:0; left:0; height:30px; line-height:30px; text-align:center; }
.banner .hd ul li{ cursor:pointer; display:inline-block; *display:inline; zoom:1; width:30px; height:11px; margin:4px;background:#CACCCB;overflow:hidden; line-height:9999px; filter:alpha(opacity=40);opacity:0.4;border-radius: 5px;}
.banner .hd ul .on{background:#30cbf3;}

/*蓝鲸来袭*/
.main{position:relative;}
.main .tit {margin: 50px 0 0;}
.main .tit h3{font-size: 26px;/*font-weight:700;*/font-style: normal;text-align:center;letter-spacing: 2px; padding-bottom:10px;}
.main .tit p{font-size: 12px;text-align: center;display: inline-block;margin-bottom: 0;overflow: hidden;width: 100%;}

.main .xl{max-width:1176px;min-width:980px;margin:60px auto}
.main .xl li{ float:left; width:33.33%;}
.main .xl li a{ margin:0 auto;display: block; position: relative; width:278px; overflow: hidden; transition: all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;}
.main .xl li a img{ width:100%}
.main .xl li a .txt {width:100%;position: absolute;height:278px; bottom: -327px; transition: all .3s; -webkit-transition:all .3s; -moz-transition:all .3s;background: #000;/*opacity: 0.5;*/}
.main .xl li a:hover .txt {bottom: 0;}
.main .xl li .txt img{position: relative;z-index:10;}
.main .xl li a .more {display: block; width: 100px; height: 22px; color: #fff; font-size: 14px; margin:216px auto 0 auto; text-align: center; line-height:22px;border: 1px solid #FFF;position: absolute;top: 0;left:32%;z-index:12;}

/*畅销产品*/
.main .pro{width:885px;margin:60px auto;height: 410px;}
.main .pro .pro-img{ width:410px; float:left;}
.main .pro .pro-img img{ width:100%}
.main .pro .pro-txt{ width:350px; float:right;line-height:40px; padding-top:80px;}
.main .pro .pro-txt:before{display:block; content:''; width:43px; height:47px; background:url(../images/yh.png);} 
.main .pro .pro-txt p{font-size:24px;}
.main .pro .pro-txt h2{font-size:24px; color:#0088be; padding-bottom:38px;}
.main .pro .pro-txt  button{text-decoration: none; font-size:16px;border-radius: 2px;width: 200px; height:55px;display: block; background:#0088be; color:#FFF;border: 0;}

#main-pro{width:1100px;margin:60px auto;}
.main .pr-hd{width:300px;height:30px; line-height:30px; text-align:center;margin:60px auto}
.main .pr-hd ul li{cursor:pointer; display:inline-block; *display:inline; width:11px; height:11px; margin:4px;background:#0088be;overflow:hidden; line-height:9999px; filter:alpha(opacity=40);opacity:0.4;border-radius: 50%; }
.main .pr-hd ul .on{  width:15px; height:15px;filter:alpha(opacity=100);opacity:1; color:#0088be }
.main .prev,
.main .next { width: 60px; height: 90px; margin: -60px 0 0; display: none; background: url(../images/ad_ctr.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; filter:alpha(opacity=20);opacity:0.2;  }
.main .prev { left: 0; }
.main .next { background-position: 0 -90px; right: 0; }
.main .prev:hover,
.main .next:hover { filter:alpha(opacity=50) !important;opacity:0.5 !important;  }

.main .video{width:1100px;margin:60px auto;}
.main .video .img {position: relative;overflow: hidden; background: #000; }
.main .video img{width:100%;display: block; opacity: .5; transition: all .8s; -webkit-transition:all .8s; -moz-transition:all .8s;}
.main .video img:hover{transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); opacity: 1;}
.main .video i { position: absolute;background: url(../images/play.png) no-repeat;width: 96px;height: 96px;top: 50%;left: 50%;margin: -48px 0 0-48px;}
/*走进蓝鲸眼泪*/
.main .about{max-width:1176px;min-width:1100px;margin:60px auto; padding-bottom:150px}
.main .about li{ float:left; width:33.33%;letter-spacing: 2px;}
.main .about li a{ width:350px; display:block;overflow:hidden;margin:0 auto; padding:20px 10px 50px 10px;}
.main .about li a:hover{ background:#f9f9f9}
.main .about li a img{ width:100%}
.main .about li a h3{ font-size:24px; padding-left:20px; padding-top:20px; padding-right:20px;}
.main .about li a span{ font-size:10px; color:#666;padding-left:20px; line-height:30px;}
.main .about li a p{ font-size:14px; color:#666;padding-left:20px; padding-bottom:50px;}
.main .about li a button{text-decoration: none; font-size:12px;width: 100px; height:30px;display: block; background:#0088be; color:#FFF;border: 0; margin-left:20px;}
/*网站底部*/
#main-food{background:#f3f3f3; overflow:hidden;}
.fooder{width:1100px;margin:0 auto; padding:20px 0;font-size:16px;}
.fooder .food-nav{ border-bottom: 1px #ccc solid; padding-bottom:10px}
.fooder .food-nav img{ width:120px; float:left;}
.fooder .food-nav ul{ float:right;}
.fooder .food-nav ul li{ float:left; padding: 0 20px; height:63px; line-height:63px; text-align: right}
.fooder .food-sunav {width:800px;margin:0 auto; padding-top:20px; text-align:center}
.fooder .food-sunav li{ float:left; width:33.33%;}
.fooder .food-sunav li h3{ color:#0088be;height: 30px; font-size:16px}
.fooder .food-sunav li a{ display:block; line-height:32px;font-size:14px;}
.fooder .food-sunav dl{ width:150px; margin:0 auto; padding-top:20px}
.fooder .food-sunav dd{ float:left; width:33.333%;position: relative;display: inline-block;vertical-align:middle;}
.fooder .food-sunav dd img{ width:30px;}
.wechat_QR{display:none; text-align:left;border: 1px solid #ddd;padding: 18px;background-color: #fff;position: absolute; width:165px; left:-94px; top:43px}
.fooder .food-sunav .f-wx:hover .wechat_QR{display: block;}
.wechat_QR:before {border-color: transparent transparent #ddd transparent;border-width: 6px;content: '';display: block;position: absolute;border-style: solid;left: 105px;top: -12px;}
.wechat_QR .QR_content {font-size: 14px;}
.wechat_QR .QR_content .QR_title {font-size: 14px;font-weight: 700; text-align:center}
.wechat_QR .QR_content ul li {width: 98%; padding-left:2%}
.wx_1{background:url(../images/wx.png) no-repeat center left;padding-left:80px !important;}

/*右栏目*/
#waper{width:1100px;margin:60px auto; padding-bottom:150px}
.main-path{width:100%; height:50px; line-height:50px; padding-bottom:30px;}
.main-typename{width:100%; height:50px; line-height:50px; font-size:26px;}
.main-nav{padding-bottom: 74px;}
.main-nav ul{height: 20px; text-align: center;margin-top: 24px; }
.main-nav ul li{ display: inline-block; margin-left:15px;}
.main-nav ul li a{display:block;color: #fff;background:#0188bf;height:58px; line-height:58px; padding:0 60px; font-size:16px;}
.main-nav ul li a:hover{background:#333333;}
.main-nav ul li.active a{background:#333333;}

.main-left{width:220px; background:#fbfbfb;padding:42px 0 18px 0px; float:left; overflow:hidden}
.main-left h3{ font-size:26px; text-align:center; padding-bottom:18px;}
.main-left h3 span{ display:block; font-size:12px}
.main-left ul li{ padding:10px 10px 0 10px;}
.main-left ul li a{display:block;height:42px; line-height:42px; background:#0188bf; color:#FFF; text-align:center}
.main-left ul li a:hover{background:#333333;}
.main-left .on a{background:#333333 !important;}


.main-right{width:800px; float:right}
.main-right ul li{ width:25%;padding:4%;float:left;border: 1px solid #fff; text-align:center}
.main-right ul li:hover{border: 1px solid #0188bf; }
.main-right ul li h3{ font-size:14px; padding:10px 0}
.main-right ul li img{ width:100%}
.main-right ul li h3 span{ display:block; font-size:10px;}
.main-right ul li button{text-decoration: none; font-size:16px;border-radius: 2px;width: 68%; height:42px;display: block; background:#0088be; color:#FFF;border: 0; margin:0 auto}
.main-right ul li a{font-size:12px}

/*精品*/
.main-right .pro-info{ text-align:center;}
.main-right .pro-info:before{display:block; content:''; width:43px; height:47px; background:url(../images/yh.png);} 
.main-right .pro-info:after{display:block; content:''; width:43px; height:47px; background:url(../images/yh-d.png); float:right} 
.main-right .pro-info .pro-img{ width:300px;margin:0 auto}
.main-right .pro-info .pro-img img{ width:100%}
.main-right .pro-info .pro-txt{padding-top:10px;}
.main-right .pro-info .pro-txt p{font-size:36px; padding-bottom:10px}
.main-right .pro-info .pro-txt h2{font-size:20px; padding-bottom:38px;}
.main-right .pro-info .pro-txt h2 span{ display:block; font-size:10px;}
.main-right .pro-info .pro-txt  button{text-decoration: none; font-size:16px;border-radius: 2px;width: 200px; height:45px;display: block; background:#0088be; color:#FFF;border: 0; margin:0 auto}
/*新闻*/
.main-about{ padding:100px 0; overflow:hidden;border-bottom: 1px solid #ddd;}
.main-about .nr{width:600px;}
.main-about .nr:before{display:block; content:''; width:43px; height:47px; background:url(../images/yh.png);} 
.main-about .nr p{line-height:28px; padding-bottom:15px; font-size:14px;}
.main-about .nr a{font-size:16px;border-radius: 2px;width: 200px; height:45px; line-height:45px;display: block; background:#0088be; color:#FFF; text-align:center}
.ablogo{ padding:50px 0;}
.ablogo li{ float:left; width:33.33%}
.ablogo li img{ width:100%}
.abpic{padding:50px 0;}
.abpic img{ width:100%}

.abqy{padding:50px 0;}
.abqy li{width:48%; margin:1%; float:left; text-align:center;background:#f9f9f9; padding:40px 0; overflow:hidden}
.abqy li:hover{background:#0088be;}
.abqy li:hover p,.abqy li:hover h5{ color:#FFF}
.abqy li .nnr{width:50%;padding-top:69px}
.abqy li h5{font-size:24px; color:#0088be; padding:30px 36px;}
.abqy li p{padding:0 36px; font-size:14px; line-height:23px; height:85px;}
.abqy li img{ width:43px}

.abvideo{margin:15px 0; overflow:hidden; }
.abvideo li{ float:left; width:33.33%;position: relative;}
.abvideo li a{ display:block; width:98%; margin:4px auto}
.abvideo li a img{ width:100%}
.abvideo i {position: absolute;background: url(../images/play.png) no-repeat; width: 96px;height: 96px;top: 50%;left: 50%;margin: -48px 0 0-48px;}
.abvideo p {position: absolute;width:98%;height: 40px; line-height:40px; bottom:3px;left: 4px; text-align:center; background:#000;filter:alpha(opacity=40);opacity:0.4; color:#FFF}

.abway{margin:65px 0;height: 273px;background: url(../images/abway.png) no-repeat center right; overflow:hidden;}
.abway ol{list-style-type:none; counter-reset:sectioncounter;}
.abway ol li{ height:50px; line-height:50px; font-size:16px;}                   
.abway ol li:before { content:"" counter(sectioncounter) ". "; counter-increment:sectioncounter;}
.abway li a:hover{ color:#038bbf}

.article{color:#333; font-size:16px; line-height:30px; overflow:hidden; width:100%; padding:50px 0; min-height:800px}
.article img{ max-width:100%; padding:15px 0;}
.article p img{ max-width:100%}
.artback{ text-align:right}
.artback a{color:#0088be;text-decoration:underline}



.main-about li { background:#f9f9f9; margin:15px 0; overflow:hidden; }
.main-about li:hover{background:#0088be;}
.main-about li:hover p,.main-about li:hover h5{ color:#FFF}
.main-about li .nnr{width:50%;padding-top:69px}
.main-about li h5{font-size:36px; color:#0088be; padding:0 36px;}
.main-about li p{padding:0 36px; font-size:14px; line-height:23px;}
.main-about li img{ width:50%}

.m-tongchuang {margin:65px 0;}
.m-tongchuang .imgbox{ width: 1146px; height: 554px; overflow: hidden; zoom: 1; position: relative; margin-left: auto; margin-right: auto; }
.m-tongchuang .imgbox i { position: absolute;background: url(../images/play.png) no-repeat;width: 96px;height: 96px;top: 54%;left: 50%;margin: -48px 0 0-48px;}
/*.m-tongchuang .imgbox p{ position: absolute; bottom: 0; left: 0; right: 0; padding: 0 10px; line-height: 40px; background: #000; background: rgba(0,0,0,.6); color: #fff; font-size: 14px; }*/
.m-tongchuang .imgbox .but{ position: absolute; top: 50%; margin-top: -15px; cursor: pointer; width: 49px; height: 49px; display: none; *_display:block; }
.m-tongchuang .imgbox:hover .but{ display: block; }
.m-tongchuang .imgbox .but:hover{ background-position: left bottom; }
.m-tongchuang .imgbox .next{ right: 10px; background: url(../images/next.png) top left; }
.m-tongchuang .imgbox .prev{ left: 10px; background: url(../images/prev.png) top left; }
.m-tongchuang img{ width: 100%; }

.m-tongchuang .imglist{ width: 1023px; margin: 100px auto; overflow: hidden; zoom: 1;position: relative; }
.m-tongchuang .imglist ul{ overflow: hidden; zoom: 1; width: 10000px; position: relative; }
.m-tongchuang .imglist li{ margin: 0 5px; float: left; width: 321px; height: 156px; overflow: hidden; zoom: 1; background: #fff; cursor: pointer; border:1px solid #fff; padding: 4px; }
.m-tongchuang .imglist img{ opacity: .6; }
.m-tongchuang .imglist .now{ border-color: #D9534F; }
.m-tongchuang .imglist img:hover,.m-tongchuang .imglist .now img{ opacity: 1; }
.m-tongchuang .listbut{ position: absolute; bottom: 138px; left: 10px; width: 31px; height: 156px; display: block; cursor: pointer; background: url(../images/prevlist.jpg); }
.m-tongchuang .listbut.nextlist{ right: 10px; left: auto;  background: url(../images/next.jpg);}



.main-newslist{ padding-top:150px;}
.main-newslist li{ float:left; width:346px;letter-spacing: 2px; height: 442px; margin:10px; overflow:hidden}
.main-newslist li a{display:block;overflow:hidden;margin:0 auto; }
.main-newslist li a:hover{background:#f3f3f3;}
.main-newslist li a .img{ height:250px; position:relative; overflow:hidden; background:#fff}
.main-newslist li a .img img{position: absolute; width:100%;margin: auto;top: -9999px;right: -9999px;bottom: -9999px;left: -9999px;}

.main-newslist li a h3{ font-size:20px; padding-left:20px; padding-top:20px; padding-right:20px;}
.main-newslist li a span{ font-size:10px; color:#666;padding-left:20px; line-height:30px;}
.main-newslist li a p{ font-size:14px; color:#666;padding-left:20px; padding-bottom:50px;}
.main-newslist li a button{text-decoration: none; font-size:12px;width: 100px; height:30px;display: block; background:#0088be; color:#FFF;border: 0; margin-left:20px;}
.main-newslist li.ntit{background:#0088be; text-align:center; color:#fff}
.main-newslist li.ntit h3{ font-size:36px; padding:55% 0}
.main-newslist li.ntit h3 span{ display:block; font-size:10px; padding-bottom:15px}
.main-newslist li.ntit h3 hr{border: 1px solid #fff; width:100px; margin:0 auto}

.mobile_QR{display:none; text-align:left;border: 1px solid #ddd;background-color: #fff;position: absolute; width:100px; left:-67px; top:43px}
.mobile_QR img{ width:100% !important;}
.fooder .food-sunav .f-sj:hover .mobile_QR{display: block;}
.fooder .copyright{ text-align:center; font-size:12px; padding:50px 0px; color:#999; line-height:25px}
.footer-sticky-nav{color: #fff;width: 100%;height: 38px;line-height: 38px;position: fixed; bottom: 0;left: 0;z-index: 9999;background-color: #0088be;}
.footer-sticky-nav-container{max-width: 1280px;margin: 0 auto;padding: 0 20px;color: #fff;line-height: 38px;}
.footer-sticky-bar-left{float: left;font-size: 0;width: 42%;}
.footer-sticky-bar-left span {font-size: 14px;color: #fff; display: inline-block;vertical-align: middle;}
.footer-sticky-bar-left>a {color: #fff;text-decoration: underline;position: absolute;margin-left: -10px;right: 50%;}
.footer-sticky-bar-right{float: right;font-size: 0;color: #fff;  line-height: 38px;}

.footer-sticky-bar-right .follow-us {line-height:normal;margin-right:17px;display:block;vertical-align:middle;color: #fff; width:150px; float:left;}
.footer-sticky-bar-right .follow-us>span {font-size: 14px;color: #fff;margin-right: 8px;margin: 0 15px;line-height: 36px;}
.footer-sticky-bar-right .follow-us-wechat {margin-right: 12px;position: relative;display: inline-block;}
.footer-sticky-bar-right .follow-us-wechat:before {display:block; content:''; width:18px; height:14px; background:url(../images/wx.svg);background-size: 100%;}
.footer-sticky-bar-right .follow-us-wechat .sub-menu{position: absolute;display: none;z-index: 10;border: 1px solid #ddd; background-color: #fff;padding: 18px;width: 335px;height: 76px;border-bottom: 1px solid #e5ddf2;border-radius: 0;left: -220px;top: -124px;}
.footer-sticky-bar-right .follow-us-wechat:hover .sub-menu{display: block;}
.footer-sticky-bar-right .follow-us-wechat .sub-menu .text {font-size:14px;width:100%;padding-left:95px;color: #999;background:url(../images/wx.png) no-repeat center left;}
.footer-sticky-bar-right .follow-us-wechat .sub-menu .text .title{font-size: 16px;line-height: 35px;color: #535355;}
.footer-sticky-bar-right .follow-us-wechat .sub-menu .text>ul>li {margin-bottom: 5px;padding-left: 12px;position: relative;}

.footer-sticky-bar-right .follow-us-weibo{position: relative;display: inline-block;}
.footer-sticky-bar-right .follow-us-weibo:before {display:block; content:''; width:18px; height:16px; background:url(../images/wb.svg);background-size: 100%;}

.footer-sticky-bar-right>ul {font-size: 0;display: block;vertical-align: middle; float:left; 172px}
.footer-sticky-bar-right>ul>li{display:block;margin: 0 15px; float:left}
.footer-sticky-bar-right>ul>li a{font-size: 14px;color: #fff;text-decoration: underline;position: relative;top: 2px;font-size: 14px;color: #fff;}

.footer-sticky-bar-right>ul>li.tel-consultation{position: relative;}
.footer-sticky-bar-right>ul>li.tel-consultation .sub-menu {position: absolute;display: none; z-index: 10;border: 1px solid #ddd;background-color: #fff;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 25px 20px 20px 40px;width: 294px;height: 100px;border-bottom: 1px solid #e5ddf2;border-radius: 0;left: -220px;top: -100px;}
.footer-sticky-bar-right>ul>li.tel-consultation:hover .sub-menu{display: block;}

.footer-sticky-bar-right>ul>li.tel-consultation .sub-menu .text {font-size: 16px;font-size: 1rem;font-weight: 700;font-style: normal;width: 100%;padding-left: 82px; background:url(../images/tel.png) no-repeat -20px center;color: #999;}
.footer-sticky-bar-right>ul>li.tel-consultation .sub-menu .text p {line-height: normal;font-size: 14px;margin: 0 0 10px;}
.footer-sticky-bar-right>ul>li.tel-consultation .sub-menu .text p:nth-child(1) {margin-bottom: 4px;}
.footer-sticky-bar-right>ul>li.tel-consultation .sub-menu .text p:nth-child(2) {font-size: 18px;font-weight: 700; margin-bottom: 0;}

.footer-sticky-bar-right .sub-menu:before {content: '';position: absolute; border-color: #ebebeb transparent transparent transparent;width: 0;height: 0; bottom: 8px;left: 82%;border-width: 6px;border-style: solid;z-index: -1;margin-bottom: -21px;}

.buybox {width:810px;display:none;z-index:99;top:50%; left:50%;margin:-230px 0 0 -405px;position:fixed;font-size:14px;height:460px;background:#fff; padding:20px; padding-top:40px;}
.buybox .bd {position: relative;}
.buybox a.close {position: absolute;top:-35px;right:-2px;color: #000;width: 30px;height: 30px;line-height: 30px;text-align: center;overflow: auto;border-radius:50%}
.buybox a.close:hover {background-color: #0088be; color:#FFF}
.opacity_bg{width:100%; position:absolute; background:#000;opacity:0.5;filter:alpha(opacity=50); top:0; left:0; display:none; z-index:98;height: 1000px;}










