/****************************** ** 初始化 ** 兼容到IE7 ** power by:www.hnjing.com ******************************/ * { margin:0; padding:0; } body { max-width:1920px; margin: 0 auto; font:14px/1.5 "Microsoft Yahei", Arial; color:#666; background:#fff; } img { border:0px; } ul,ol { list-style-type:none; vertical-align:bottom; } table { border-collapse:collapse; border-spacing:0; } input,textarea,select { font:14px/1 "Microsoft Yahei", Arial; color:#666; outline:0; } textarea { resize:none; overflow:auto; } h1,h2,h3,h4,h5,h6,font { font-size:14px; } a { color:#333333; text-decoration:none; cursor:pointer; } a:hover,a:active { color:#000; text-decoration:none; } .clear { clear:both; font-size:0px; line-height:0px; height:0px; } .clearfix:after{content:""; clear:both;font-size:0px; line-height:0px; height:0px; } .fl{float: left;} .fr{float: right;} .hidden { display:none; } .center { text-align:center; } .arrow { font-family:'Small Fonts'; font-style:normal; color: #F5F5F5; font-size:15px; } .autocut{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:break-all; } [nowrap]{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:break-all; } .wrapper, .wrap { width:1100px; margin:0 auto; position:relative; } .wrapper { margin-bottom:50px; min-height:auto; padding-top:30px; } .oFHiden{ overflow: hidden;} /****************************** ** 首页风格 ******************************/ /*head*/ .maiHead{height:120px; width: 100%; background-color: #e21e1f; border-bottom: 1px solid #f83e3f; } .maiHead .logo{ width:180px; height:237px; display: block !important; position: absolute; left: 50%; margin-left:-90px; top:0; background:url(../images/logoBg.png) no-repeat center top; z-index: 100; } .maiHead .headBox{z-index: 100; height: 120px; } .maiHead .logo img{ width:150px; height:160px; margin:14px auto 0; display: block; } .maiHead .topAdv{ height:60px; font-weight: normal; padding-left: 18px; margin-top: 25px; position: absolute; left:0; top:0; } .maiHead .topAdv h3{font-size:32px; font-weight: bold; color:#fff; opacity: .95; filter:alpha(opacity=95); line-height: 38px; } .maiHead .topAdv h4{ font-size:14px; font-weight: bold; color:#fff; opacity: .85; filter:alpha(opacity=85); line-height: 26px; } .topTel{ height: 52px; background:url(../images/tolTel.png) no-repeat left center; padding-left: 50px; margin-top: 38px; position: absolute; right: 0; top: 0;} .topTel h5{font-weight: normal; font-size:18px; color:#fff; line-height: 24px;} .topTel h6{color:#fff; font-family:"impact"; font-weight: normal; font-size:30px; line-height: 26px; } /*soucang*/ .maiHead .shoucang{ position: absolute; right:0; top:3px; float: right; text-align: center; width: 264px; height: 22px; line-height: 22px; } .maiHead .shoucang a{color: #fff;font-size:12px; background:url(../images/soucang.png) left center no-repeat; padding-left:13px; margin-left: 17px;} .maiHead .shoucang a:first-child{margin-left: 0;} .maiHead .shoucang a:hover{ text-decoration: underline; } .nav { width:100%; height:68px; position:relative; z-index:10; background:#e21e1f; } .nav .navBox{} .nav .listLeft, .nav .listRight{position: absolute; width: 460px; } .nav .listLeft{left:0; top:0; } .nav .listRight{right:0; top: 0; } .nav .list { height:68px; } .nav li { float:left; width:115px; height:68px; text-align:center; position:relative; transition:background-color .3s;} .nav li > a { display:block; height:61px; padding-top: 15px; line-height:20px; font-size:16px; font-weight: bold; color:#fff; } .nav li.current, .nav li:hover {background-color: #C30506;} .nav li > a font{font-size:10px; color:#fff; text-transform: uppercase; font-weight: normal;} .nav li.current > a, .nav li:hover > a { color:#fff; } .nav .drop {border-top:4px solid #fff; position:absolute; left:0; top:68px; width:100%; background:rgba(66,0,0,.8); background:url(about:blank)\9; overflow:hidden; display:none; } @media \0screen\,screen\9 { .nav .drop { filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#C8420000,endColorstr=#C8420000);}} .nav dl { width:100%; } .nav dd { height:40px; line-height:40px; padding:0 4px;} .nav dd:hover a{color:#f6b309 } .nav dd a { display:block; color:#fff ; border-top:1px dotted #fff; } .nav dd:first-child a{border: none;} .banner { width:100%; min-width:1000px; position:relative; overflow:hidden; z-index:2; } .banner ul { width:100%; } .banner li { width:100%; position:absolute; z-index:1; overflow:hidden; background:#fff; display:none; } .banner li:first-child { display:block; } .banner img { width:1920px; display:block; position:relative; left:50%; margin-left:-960px; top:0; } .banner .prev, .banner .next { width:50px; height:128px; position:absolute; top:50%; margin-top:-64px; z-index:3; cursor:pointer; } .banner .prev { left:50%; margin-left:-530px; background:url(../images/banner_bt.png) left center no-repeat; } .banner .next { right:50%; margin-right:-530px; background:url(../images/banner_bt.png) right center no-repeat; } .banner .prev:hover, .banner .next:hover { opacity:.6; } .banner, .banner ul,.banner img { height:500px; } .banner.mini, .banner.mini ul, .banner.mini img { height:350px; } .searcher { border-bottom: 1px #d4d4d4 solid; border-radius:6px; height: 54px; margin-bottom:0px; width: 100%; margin:0 auto; margin-top: 1px; } .searcher .seaBox{ height: 54px; } .searcher .tag h2 { font-size:17px; font-weight:normal; color:#272727; line-height: 54px; font-size:14px; padding-left: 2px;} .searcher .tag h2 a{color:#6c6c6c; padding:0 2px;} .searcher .tag h2 a:hover{text-decoration: underline;} .searcher .sos { width:307px; height:34px; position:absolute; right:2px; top:10px; background:url(../images/sousuo.png) right center no-repeat; } .searcher .sos .txt { width:267px; height:34px; line-height:34px; border:none; padding-left:20px; color: #a7a7a7; background: none; } .searcher .sos .submit {display: block; position:absolute; right:0; top:0px; width:46px; height:34px; background: none; border:0; cursor:pointer; color:#fff ; } /*ipro公用标题*/ .iproTitle{ background:url(../images/titleL.png) 235px 22px no-repeat; } .iproTitle .iproTitleBox{ text-align: center; height: 52px; background:url(../images/titleR.png) 645px 22px no-repeat; } .iproTitle .iproTitleBox h1{font-size:30px; line-height: 36px; color:#333333; } .iproTitle .iproTitleBox h2{font-size:14px; color:#9a9a9a; font-weight: normal; text-transform: uppercase; line-height:18px; } /*ipro*/ .ipro{ padding-top: 30px; } .ipro .iproMaxBox{padding-top:38px; } .ipro_l{ float:left; width:240px; height:576px;} .ipro_l .ipr_top{ width:240px; height:80px; background:#e21e1f;} .ipro_l .ipr_top h1{ padding-top:18px; width:240px;text-align:center; font-size:20px; color:#ffffff; line-height: 26px; } .ipro_l .ipr_top h3{width:240px;text-align:center;color:#fff; font-size: 14px; text-transform: uppercase; font-weight: normal; } .ipro_l .ipr_bottom{width:238px; height:544px; background:#ffffff; border:1px solid #d9d9d9; border-top:none; } .ipro_l .ipr_bottom ul{ width:240px; } .ipro_l .ipr_bottom li{ width:240px; height:64px; line-height:64px; text-align:center;border-top:1px solid #d9d9d9; background:url(../images/proTitleBg.png) 7px -16px no-repeat; } .ipro_l .ipr_bottom li:first-child{ border-top: none; } .ipro_l .ipr_bottom li a{ display:block; margin-right: 10px; height:64px;color:#404040; font-size: 18px; font-weight: bold; background:url(../images/proTitleBg.png) right 27px no-repeat; } .ipro_l .ipr_bottom li a:hover{ color:#c82526;} .ipro_r{ float:right; width:840px; } .ip_content{ width:840px; overflow:hidden;} .ip_content ul{ overflow:hidden;} .ip_content li{ position:relative; float:left; width:268px; height:200px;margin-bottom: 12px; margin-right:12px; background-color: #6B0001;} .ip_content li a{ display: block;width:268px; } .ip_content li img{ width:268px; height:200px; display: block; } .ip_content li a:hover h1{ color:#e21e1f;} .ip_content li .itm{height: 0px;top: 80px;width:268px;left: 0px;background:url(../images/zhezhao.png) center no-repeat;position: absolute;text-align: center;overflow: hidden; cursor:pointer;color:#e62a05;} .ip_content li .itm a{display: block; height: 80px; padding-top: 120px; width: 268px; color: #fff; font-size: 20px; font-weight: bold; line-height: 30px; } /*tongxun*/ .tongxun{ text-align: center; height: 58px; padding: 14px 0; border: 1px #ebebeb solid; padding-left: 25px; width: 1075px; margin-top: 24px;} .tongxun a{display: inline-block; zoom:1; *display: inline; text-align: left; border-left: 1px #ebebeb solid; height: 58px; line-height: 58px; width: 186px; padding-left: 76px; background: url(../images/gongju.png) 26px 13px no-repeat; vertical-align: middle; } .tongxun a:first-child{border-left: none !important; text-transform: uppercase; } .tongxun a:hover{color: #e21e1f; } a.ilx{font-family: "Impact"; font-size: 30px; text-indent: 10px; } a.idh{font-size: 24px; font-weight: bold; background-position: 26px -67px; white-space: nowrap; cursor: text;} a.iyx , a.izx{line-height: 20px; padding-left: 86px; width: 176px; } a.iyx{ cursor: text; background-position: 26px -143px;} a.izx{ background-position: 26px -221px;} a.iyx font , a.izx font{font-size: 19px; font-weight: bold; display: block; padding-top: 10px; } /*iabout*/ .iabout { color:#2E2E2E; background: url(../images/aboutBg.jpg) center no-repeat #e32422; height: 431px; margin-top: 34px; } .iabout .iaboutBox{ width: 1100px; margin:0 auto; position: relative; } .iabout .sketchmap { position: absolute; width:440px; height: 300px; overflow:hidden; left:0; top:56px; background: url(../images/aboutImgBg.png) right bottom no-repeat; } .iabout .sketchmap img { display:block; width:396px;height :260px; border: 3px #fff solid;} .iabout .info { padding-left: 494px; font-size:14px; position:relative; line-height:24px; padding-top: 34px;} .info>h1{ padding-left: 74px; padding-top: 50px; height: 50px; color:#fff; background: url(../images/aboutTitle.png) left bottom no-repeat #e32422;} .info>h1 span{ display: block; font-size:24px;font-weight: bold; line-height: 34px; } .info>h1 font{ display: block; font-weight: normal; font-size:14px; height: 16px; line-height: 20px; text-transform: uppercase; background: url(../images/aboutTitleT.png) 72px bottom no-repeat } .iabout .info>p{padding-top: 10px; color:#fff; line-height: 26px; } .iabout a.iaboutMore{ display: block; width: 133px; height:27px; line-height: 27px; margin-top: 10px; background: url(../images/aboutMore.png) center no-repeat ;color:#fff; font-weight: bold; text-indent: 24px; } /*xinwen*/ .xinwen{padding-top: 34px; padding-bottom: 37px;} .xinwen .xinewnBox{overflow: hidden; } .xinewnBox dl{ padding-top: 38px; *padding-bottom: 30px; width: 1130px; float: left;} .xinewnBox dd{background-color: #F4F4F4; margin:0 30px 24px 0; width: 346.666px; height: 88px; position: relative; } .xinewnBox .riqi{position: absolute; left:10px; top:10px; width:66px; height: 66px; background-color: #727171;} .xinewnBox .riqi font,.xinewnBox .riqi span{ display: block; width:100%; text-align: center; font-size:32px;color:#fff; } .xinewnBox .riqi span{ height: 40px; } .xinewnBox .riqi font{ font-size: 14px; height: 26px; } .xinewnBox dd>a{padding-left: 90px; padding-right: 10px; display: block; line-height: 42px; font-size:16px; color:#000000; height: 36px } .xinewnBox dd>a:hover{color:#e21e1f} .xinewnBox dd>h6{padding-left: 90px; padding-right: 10px; font-size:14px; font-weight: normal; color:#727171; } .xinewnBox dd:hover > em{background-color: #ffce10; transform: rotate(180deg); -webkit-transform: rotate(180deg);} /*inews*/ .inews { padding:42px 0 0; } .inews .inewsContenBox{padding-top: 30px; } .inews .main { padding:0 0 12px; height:236px; position:relative; z-index: 2; overflow:hidden; width: 100%; margin:0 auto; padding-bottom: 58px; } .inews .list { width:500%; float:left; position:relative; height: 242px; } .inews .item{ float:left; width:260px; position:relative; margin:0 0 0 20px; } .inews .item:first-child { margin-left:0; } .inews .item a.inewsTitle{transition:background .3s ; color:#fff; font-size:16px; display: block; text-indent: 12px; line-height: 46px; height: 46px; position: relative; background-color: #2e2f33;} .inews .item a.inewsTitle span{ display: block; position: absolute; right:8px; top: 4px; width: 30px; height: 38px; background:url(../images/caseMore.png) right center no-repeat; -moz-transition: -moz-transform .5s; -webkit-transition: -webkit-transform .5s; } .inews .item img { width:100%; height:195px; display:block; } .inews .item:hover a.inewsTitle{ background-color: #e02120;} .inews .item:hover a.inewsTitle span{ -moz-transform:rotateY(360deg); -webkit-transform:rotateY(360deg); } .inews .qiehuan{width: 74px; height: 33px; position: absolute; bottom:0; left:50%; margin-left: -37px; background:url(../images/caseTip.png) left center no-repeat; } .inews .qiehuan font{display: block; width: 33px; height: 33px; cursor: pointer;} /*icontact*/ .icontact{width: 100%; overflow: hidden; height: 492px; background-color: #e21e1f; position: relative; } .icontact .icontactBox{color: #fff; height: 492px; } .icontact .icLeft{width: 380px; padding-top: 86px; height: 406px; position: absolute; left: 0; top: 0; } .icontact .icontactBox h1{font-size: 20px; padding-bottom: 5px; } .icontact .icontactBox h3{font-size: 14px; font-weight: normal; line-height: 26px; padding-right: 60px; } .icontact .icontactBox h2{ background:url(../images/contactBg.png) center no-repeat; width: 39px; height: 204px; font-size: 25px; line-height: 27px; position: absolute; right:0; top:86px; padding-left: 26px; } .icontact .icRight{ width: 1130px; height: 492px; position: absolute; left:380px; top:0; } .icontact .icRight .bdmap .BMap_mask, .icontact .icRight .bdmap{ height: 492px; } .icontact .icTop{ background:url(../images/btMapBg.png) center top no-repeat; position: absolute;left:0; top:0; width: 100%; height: 86px;} .icontact .gotopBox{width: 1100px; margin:0 auto; height: 86px; position: relative; } .icTop .gotopBox font{display: block; width:200px; height: 44px; cursor: pointer; position: absolute; z-index: 2; right: 13px; top:23px; } .icontact .icFooter{position: absolute; left:0;bottom: 0; background:url(../images/btMapBg2.png) center top no-repeat; height: 166px; width: 100%;} .icontact .footerCtent{padding-top: 88px; } .icontact .icFooter h6{color: #adadad; font-weight: normal; } .icontact .icFooter h6 a{color: #adadad;} /*btLink*/ .btLink{border: 1px #eee solid; border-radius: 4px; height: 40px; line-height: 40px; padding: 0 10px; margin-bottom: 30px;} .linkBox{background:url(../images/link.png) left center no-repeat; height: 40px; padding-left: 120px; text-align: left;} .linkBox a{display: block;float: left; padding:0 20px; border-left: 1px #eee solid; height: 14px; line-height: 20px;margin-top: 10px;font-size: 12px; vertical-align: middle; } .linkBox a:first-child{border: none;} /*btNav*/ .btNav{height:50px; background-color: #2e2e2e; } .btNav a{float: left; width: 86px; line-height: 50px; text-align: center; color:#d7d7d7; } .btNav a:hover{color:#E21E1F; } /*bt版权*/ .bottomer { background:#2e2e2e; line-height:28px; min-height:158px; padding:0 0 30px; color:#d7d7d7; } .bottomer .erwei{padding:14px 13px 0; width:174px; position:absolute; right:0; top:-14px; background:url(../images/erweima_bg.png) top center no-repeat; } .bottomer .pos { text-align: center; background-color: #3c3c3c ; min-height: 153px; padding-top: 35px ;color:#fff; } .bottomer .pos img{display: block; width: 100px; height: 100px; margin:0 auto; } .bottomer a{color:#d7d7d7; } .bottomer a:hover{color:#E21E1F; } /****************************** ** 内页架构 ******************************/ .sidebar { float:left; width:240px; } .side-menu { border:1px solid #ddd; } .topclass { width:100%; text-align:center; background-color: #E21E1F;} .topclass h2 { height:70px; line-height:24px; font-size:12px; color:#F5F5F5; text-transform: uppercase; font-weight: normal;} .topclass h2 font{ font-size:24px;display: block; padding-top: 15px; font-weight: bold;} .topclass p { font-size:15px; } .side-menu .list { background:#fff; padding:5px 0 15px; } .side-menu dd { padding:0 20px; background:url(../images/proTitleBg.png) 20px -18px no-repeat; } .side-menu dd > a { display:block; height:60px; line-height:60px; font-size:18px; padding:0 0 0 30px; border-bottom:1px dashed #ddd; overflow:hidden; } .side-menu dd > a:hover { font-weight: bold; color:#666} .side-menu .drop { width:100%; display:none; border-bottom:1px dashed #ddd; padding:5px 0; } .side-menu .drop li { width:100%; height:30px; line-height:30px; } .side-menu .drop a { display:block; padding:0 0 0 30px; font-size:15px; background:url(../images/icase_bg2.png) no-repeat 12px center;} .side-menu .drop a:hover { font-weight: bold; color:#666 } .side-menu dd.current { } .side-menu li.current > a, .side-menu dd.current > a { color:#E21E1F; font-weight:bold; } .side-contact { margin-bottom:20px; position:relative; top:20px; background:#FFF; } .side-contact .sketch { } .side-contact .sketch img { display:block; } .side-contact .main { line-height:2; border:1px solid #ddd; color:#F5F5F5; } .side-contact .main h2 {height: 60px;line-height: 60px; font-size:24px; text-align:center; background-color: #E21E1F;} .side-contact .main h6{padding:10px 15px 15px; font-weight: normal; color:#666; } .location { height:60px; line-height:60px; background:#E21E1F; position:relative; margin-bottom:-1px; } .location h2 { font-size:22px; font-weight:normal; padding:0 0 0 20px; color:#F5F5F5; } .location .io { position:absolute; top:0; right:20px; padding:0 0 0 15px; color:#F5F5F5; } .location .io a { color:#F5F5F5; } .location .io a:hover { text-decoration:underline; } .location + * { border:1px solid #ddd; } .container { float:right; width:820px; } .content { padding:20px; border:1px solid #ddd; margin-bottom:20px; } /****************************** ** 内页页面通用 ******************************/ /* 4:3 图片 */ .list-product { background:#fff; padding:20px 0; margin-bottom:10px; } .list-product .list { float:left; width:100%; } .list-product .item { float:left; width:246px; margin:0 0 0 20px; } .list-product .item a{display: block; } .list-product .item .img { width:100%; overflow:hidden; background:#f1f1f1; } .list-product .item .img a{width: 100%; height:184px; position: relative; overflow: hidden; background-color: #E21E1F} .list-product .item .img img { display:block; width:100%; position: absolute; top: 0; left: 0; height: 100%; -webkit-transition: -webkit-transform 2s; transition: transform 2s; } .list-product .item:hover .img img{ transform: rotate(-5deg); -ms-transform: rotate(-5deg); -webkit-transform: rotate(-5deg); -o-transform: rotate(-5deg); -moz-transform: rotate(-5deg); } .list-product .item h3 { height:40px; line-height:40px; text-align:center; font-weight:400; } .list-product .item h3 a { } /* 4:3 图文 */ .list-case { padding:0 20px; margin-bottom:10px; background:#fff; } .list-case .list { padding:10px 0 10px; } .list-case .item { padding:15px 0 15px 200px; height:135px; border-top:1px dashed #ddd; position:relative; } .list-case .item:first-child { border-top:0; } .list-case .item .img { position:absolute; left:0; top:15px; width:180px; height:135px; background:#f1f1f1; } .list-case .item .img img { display:block; width:180px; height:135px; } .list-case .item h3 { font-size:16px; line-height:20px; margin-bottom:8px; } .list-case .item h3 a { } .list-case .item h3 a:hover { text-decoration:underline; } .list-case .item p { height:60px; line-height:20px; color:#666; overflow:hidden; margin-bottom:16px; } .list-case .item .detail { height:20px; } .list-case .item .detail a { line-height:20px; } /* 3:4 图文 */ .list-case2 { padding:0 20px; margin-bottom:10px; background:#fff; } .list-case2 .list { padding:10px 0 10px; } .list-case2 .item { padding:15px 0 15px 140px; height:90px; border-top:1px dashed #ddd; position:relative; } .list-case2 .item:first-child { border-top:0; } .list-case2 .item .img { position:absolute; left:0; top:15px; width:120px; height:90px; background:#f1f1f1; } .list-case2 .item .img img { display:block; width:120px; height:90px; } .list-case2 .item h3 { font-size:16px; line-height:20px; margin-bottom:8px; } .list-case2 .item h3 a { } .list-case2 .item h3 a:hover { text-decoration:underline; } .list-case2 .item p { height:44px; line-height:20px; color:#666; overflow:hidden; } .list-case2 .item .detail { height:20px; } .list-case2 .item .detail a { line-height:20px; } /* 图片相册 */ .list-photo { width:100%; } .list-photo .list { float:left; width:101.5%; } .list-photo .item { float:left; width:183px; padding:10px 10px 0; border:1px solid #ddd; margin:0 10px 10px 0; cursor:pointer; } .list-photo .item .img { width:100%; height:137px; overflow:hidden; background:#f1f1f1; } .list-photo .item .img img { width:100%; height:137px; } .list-photo .item h3 { height:40px; line-height:40px; text-align:center; font-weight:400; } .list-photo .item:hover { border-color:#c8a48e; } /* 附属简介 */ .list-news { padding:0 20px; margin-bottom:10px; background:#fff; } .list-news .list { padding:10px 0 10px; } .list-news .item { padding:15px 0; height:70px; border-top:1px dashed #ddd; position:relative; } .list-news .item:first-child { border-top:0; } .list-news .item .date { position:absolute; right:0; top:15px; line-height:20px; color:#777; } .list-news .item h3 { font-size:16px; line-height:20px; margin-bottom:8px; } .list-news .item h3 a { } .list-news .item h3 a:hover { text-decoration:underline; } .list-news .item p { height:40px; line-height:20px; color:#777; overflow:hidden; } /* 新闻详情页 */ .news-content { } .news-content h1 { padding:0 0 10px; font-size:22px; line-height:1.4; } .news-content .rap { height:40px; line-height:40px; border-bottom:1px dashed #ddd; margin-bottom:20px; } .news-content .rap span { margin:0 20px 0 0; } .news-content .rap b { font-weight:400; } /* 案例详情页 */ .case-content { } .case-photo { width:100%; text-align:center; } .case-photo img { max-width:100%; } .case-content h1 { padding:10px 0 20px; font-size:20px; color:#666; line-height:1.4; text-align:center; } /* 产品详情页 */ .product-content { } .product-content h1 { font-size:22px; line-height:1.2; margin-bottom:20px; } .product-photo { float:left; width:400px; } .product-photo .original { width:420px; height:315px; overflow:hidden; margin-bottom:10px; border:1px solid #ddd; } .product-photo .original img { display:block; width:auto; height:315px; margin:0 auto; } .product-info { margin:0 0 0 450px; } .product-info .inso { margin-bottom:20px; } .product-info .inso dd { height:20px; line-height:20px; margin-bottom:10px; font-size:16px; } .product-info .inso span { color:; } .product-info .tel { padding:15px 0 15px 20px; border:1px solid #ddd; margin-bottom:27px; } .product-info .tel dt { height:30px; line-height:30px; font-size:18px; padding:0 0 0 35px; background:url(../images/ico-tel.png) left center no-repeat; } .product-info .tel dd { font-size:30px; color:#E21E1F; line-height:1.2; } .product-info .order { margin-bottom:70px; overflow: hidden;} .product-info .order a { display:block; width:156px; height:40px; float: left; line-height:40px; color:#FFF; font-size:16px; font-weight:700; background:#666; text-align:center; } .product-info .order a:first-child{margin-right: 10px; background-color: #E21E1F;} .product-info .order a:hover { opacity:.8; filter:alpha(opacity:80); transition:all .2s ease 0s} .article-container { border-top:1px dashed #ddd; margin:20px 0 0; padding-top:15px; } .article-container .article { padding-bottom:10px; } .article-head { padding:20px 0 10px; } .article-head h2 { width:240px; height:40px; line-height:40px; padding:0 0 0 15px; background:#f8f8f8; font-size:16px; color:#5f412e; } /* 产品详情页 */ .original2 { width:600px; height:auto; overflow:hidden; margin:0 auto 10px; } .original2 img { display:block; max-width:100%; height:auto; margin:0 auto; } .product-info2 { position:relative; padding:10px 0px 10px 0; min-height:35px; } .product-info2 h1 { font-size:20px; text-align:center; } .product-info2 .tel { width:220px; height:; background:url(../images/ico-tel2.png) left top no-repeat; padding:0 0 0 60px; line-height:1.1; position:absolute; right:0; top:10px; display:none; } .product-info2 .tel dt { font-size:16px; font-weight:700; } .product-info2 .tel dd { font-size:30px; color:#ff5d0c; font-weight:700; } /****************************** ** 组件类 ******************************/ .toolbar { width:60px; position:fixed; right:0; top:50%; margin:-132px 0 0 0; z-index:50; } .toolbar *{transition:background .2s; } .toolbar dd { width:60px; height:60px; background:none; position:relative; } .toolbar dd > i { display:block; width:60px; height:60px; cursor:pointer; } .toolbar .slide-qq { display:block; width:100px; height:60px; line-height:60px; font-size:20px; color:#FFF; padding:0 0 0 60px; position:absolute; top:0; left:0; overflow:hidden; } .toolbar .pop { position:absolute; right:90px; top:-60px; background:#e11526; display:none; } .toolbar .pop-tel { width:120px; padding:40px 20px 30px; color:#FFF; text-align:center; } .toolbar .pop-tel .icon { height:30px; line-height:30px; padding-top:55px; background:url(../images/tool-telphone2.png) center 0 no-repeat; } .toolbar .pop-tel .item { line-height:24px; font-size:16px; } .toolbar .pop-code { width:120px; padding:20px 20px 0; } .toolbar .pop-code img { width:120px; height:120px; display:block; } .toolbar .pop-code h3 { height:50px; line-height:50px; text-align:center; color:#f2e8e1; font-size:16px; font-weight:400; white-space:nowrap; } .toolbar .qq { background:url(../images/tool-qq.png) -3px center no-repeat #e21e1f; } .toolbar .qq:hover { background:url(../images/tool_qq_hover.png) 0 0 no-repeat #c61011; } .toolbar .tel { background:url(../images/tool-telphone.png) center center no-repeat #e21e1f; } .toolbar .tel:hover { background:url(../images/tool-telphone2.png) center center no-repeat #c61011; } .toolbar .code { background:url(../images/tool-code2.png) center center no-repeat #e21e1f; } .toolbar .code:hover { background:url(../images/tool-code2.png) center center no-repeat #c61011; } .toolbar .top { background:url(../images/tool-top.png) center center no-repeat #e21e1f; } .toolbar .top:hover { background:url(../images/tool-top2.png) center center no-repeat #c61011; } .pager { width:100%; height:40px; padding:0; border:1px solid #ddd; overflow:hidden; } .pager > * { float:left; height:40px; line-height:40px; padding:0 20px; background:#FFF; border-right:1px solid #ddd; } .pager > *:first-child { display:none; } .pager > *:first-child + * { margin-left:0px; } .pager > span { cursor:no-drop; } .pager > span.cur { cursor:default; background:#f1f1f1; color:#000; font-weight:700; } .pager > a:hover { background:#f1f1f1; } .relink { padding:0 20px; height:40px; line-height:40px; background:#fff; margin-bottom:20px; border:1px solid #ddd; } .relink p { float:right; width:50%; text-align:right; overflow:hidden; } .relink p:first-child { float:left; text-align:left; } .recommend-pro { background:#fff; padding:0 20px; margin-bottom:20px; border:1px solid #ddd; } .recommend-pro .head { height:60px; line-height:60px; position:relative; border-bottom:1px solid #ddd; } .recommend-pro .head h2 { font-size:18px; } .recommend-pro .head .mo { position:absolute; right:0; top:0; font-size:16px; color:#999; } .recommend-pro .head .mo:hover { color:#ff5d0c; } .recommend-pro .main { width:100%; overflow:hidden; padding:20px 0; } .recommend-pro .list { float:left; width:110%; } .recommend-pro .item { float:left; width:180.3px; margin:0 19px 0 0; } .recommend-pro .item .img { width:100%; height:135px; overflow:hidden; margin-bottom:10px; background:#f1f1f1; } .recommend-pro .item .img a{display: block; width: 100%; height:135px; overflow: hidden; position: relative; } .recommend-pro .item .img img { width:100%; height: 100%; display: block; position: absolute; left: 0; top: 0; -webkit-transition: -webkit-transform 1s; transition: transform 1s; } .recommend-pro .item:hover .img img{ transform: rotate(-10deg); -ms-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); -o-transform: rotate(-10deg); -moz-transform: rotate(-10deg); } .recommend-pro .item h3 { height:30px; line-height:30px; text-align:center; margin-bottom:10px; font-weight:400; } .recommend-pro .item h3 a { } .recommend-pro .item .order { text-align:center; } .recommend-pro .item .order a { display:block; height:32px; line-height:32px; width:124px; margin:0 auto; color:#fff; background:url(../images/order.png) center center no-repeat; } .recommend-pro .item:hover { } .recommend-pro .item .order a:hover { background-image:url(../images/order-hover.png); } .recommend-form { padding:0 20px; background:#fff; border:1px solid #ddd; } .recommend-form .head { height:60px; line-height:60px; position:relative; border-bottom:1px solid #ddd; } .recommend-form .head h2 { font-size:18px; } .recommend-form .main { width:100%; overflow:hidden; padding:40px 0 20px; } .recommend-form .main > * { float:left; width:100%; clear:both; margin-bottom:15px; position:relative; } .recommend-form .row-1 { width:350px; height:auto; padding:0 0 0 50px; border:1px solid #ddd; } .recommend-form .row-2 { width:638px; height:auto; padding:0 0 0 0; border:1px solid #ddd; } .recommend-form .row-3 { width:650px; height:auto; } .recommend-form .ico-name { background:url(../images/form-name.png) 15px center no-repeat; } .recommend-form .ico-phone { background:url(../images/form-phone.png) 15px center no-repeat; } .recommend-form .ico-email { background:url(../images/form-email.png) 15px center no-repeat; } .recommend-form .required .tip { position:absolute; right:0; top:0; height:40px; line-height:40px; padding:0 10px; font-style:normal; color:#F00; } .recommend-form .txt { width:100%; height:40px; line-height:40px; background:#fff; border:0; color:#999; } .recommend-form .text { width:628px; border:0; background:#FFF; padding:5px 5px; line-height:20px; height:100px; color:#999; } .recommend-form img.code { float:left; width:110px; height:42px; } .recommend-form input.code { float:left; width:150px; height:40px; line-height:40px; border:1px solid #ddd; background:#FFF; margin-left:10px; padding:0 10px; color:#999; } .recommend-form .submit, .recommend-form .reset { float:left; margin:0 0 0 10px; width:164px; height:42px; border:0; cursor:pointer; color:#FFF; font-size:16px; } .recommend-form .submit { background:#E21E1F; } .recommend-form .reset { background:#666; } .recommend-form .submit:hover { opacity:.8; filter:alpha(opacity:80);} .recommend-form .reset:hover { opacity:.8; filter:alpha(opacity:80)} .recommend-form .onfocus, .recommend-form .onfocus input.code { border-color:#aaa; } .bdmap { height:400px; } .BMap_bubble_title a { display:inline-block; padding:4px 10px; background:#666; color:#fff; border-radius:3px; } .BMap_bubble_title a:hover { background:#999; } .BMap_bubble_title + .BMap_bubble_content { line-height:16px; padding:5px 0 0; color:#777; } .bdshare { width:auto; height:36px; } .bdshare > * { float:right; } .bdshare .head { height:36px; line-height:36px; } .article { line-height:2; padding:20px; font-family:"microsoft YaHei UI" !important; background:#fff; } .article img { max-width:100%; } .article-adv { height:100px; background:#5f412e; margin-bottom:20px; } .article-adv .icon { float:left; width:; height:80px; margin:10px 20px 0 20px; } .article-adv .tel { float:left; margin:20px 0 0 0; } .article-adv .tel dt { font-size:16px; color:#c8a48e; background:url(../images/ico-tel2.png) left center no-repeat; padding:0 0 0 25px; } .article-adv .tel dd { line-height:1.2; font-size:32px; color:#f0c422; } .article-adv .qiao { float:right; width:126px; height:36px; margin:32px 20px 0 0; background:url(../images/ico-qiao.png) center center no-repeat; line-height:33px; text-align:center; color:#5f412e; } .article-adv .qiao:hover { background-image:url(../images/ico-qiao-hover.png); } .ajax-pager { text-align:right; padding:10px 0; } .ajax-pager > * { display:inline-block; height:32px; line-height:32px; padding:0 20px; border:1px solid #ddd; margin-left:-6px; background:#FFF; } .ajax-pager span { cursor:no-drop; } .ajax-pager span.current { cursor:default; } .ajax-pager a:hover { background:#f1f1f1; } .ig-form-notice { position:absolute; z-index:101; width:auto; padding:5px 20px; border:1px solid #e0272c; background:#ffe8e9; border-radius:3px; box-shadow:1px 1px 5px rgba(0,0,0,0.2); color:#e0272c; } .ig-form-notice:before, .ig-form-notice:after { content:''; position:absolute; left:20px; top:-20px; width:0; height:0; border:10px solid transparent; border-bottom-color:#e0272c; } .ig-form-notice:after { top:-19px; border-bottom-color:#ffe8e9; } [ig-null], [ig-loading] { margin-bottom:0px; padding:0 20px; } .dialog-alert { width:440px; height:auto; position:fixed; left:50%; top:50%; margin:-150px 0 0 -220px; z-index:100; background:#FFF; background:-webkit-linear-gradient(top, #f1f1f1 0%, #FFF 10%, #FFF 100%); display:none; } .dialog-alert .head { height:40px; line-height:40px; position:relative; margin-bottom:10px; } .dialog-alert .head h2 { font-size:16px; padding:0 0 0 15px; } .dialog-alert .head .close { width:40px; height:40px; background:url(../images/ico-close.png) center center no-repeat; position:absolute; right:0; top:0; } .dialog-alert .head .close:hover { -webkit-transform:rotate(90deg); transform:rotate(90deg); } .dialog-alert .main { padding:0 20px 20px 20px; font-size:14px; } .dialog-alert .main .red { color:#F00; } .dialog-alert .foot { height:34px; text-align:center; border-top:1px solid #fff; padding:10px 0 20px; } .dialog-alert .foot a { display:inline-block; vertical-align:middle; height:34px; line-height:34px; padding:0 25px; background:#ddd; margin:0 10px; font-size:14px; border-radius:3px;} .dialog-alert .foot .ok { background:#d93636; color:#fff; } .dialog-alert .foot .ok:hover { background:#a40606; } .dialog-alert .foot .cancel { background:#bbb; color:#333; } .dialog-alert .foot .cancel:hover { background:#999; } .dialog-confirm { width:440px; height:auto; position:fixed; left:50%; top:50%; margin:-150px 0 0 -220px; z-index:100; background:#FFF; background:-webkit-linear-gradient(top, #f1f1f1 0%, #FFF 10%, #FFF 100%); display:none; } .dialog-confirm .head { height:40px; line-height:40px; position:relative; margin-bottom:10px; } .dialog-confirm .head h2 { font-size:16px; padding:0 0 0 15px; } .dialog-confirm .head .close { width:40px; height:40px; background:url(../images/ico-close.png) center center no-repeat; position:absolute; right:0; top:0; } .dialog-confirm .head .close:hover { -webkit-transform:rotate(90deg); transform:rotate(90deg); } .dialog-confirm .main { padding:0 20px 20px 20px; font-size:14px; } .dialog-confirm .main .red { color:#F00; } .dialog-confirm .foot { height:34px; text-align:center; border-top:1px solid #fff; padding:10px 0 20px; } .dialog-confirm .foot a { display:inline-block; vertical-align:middle; height:34px; line-height:34px; padding:0 25px; background:#ddd; margin:0 10px; font-size:14px; border-radius:3px;} .dialog-confirm .foot .ok { background:#d93636; color:#fff; } .dialog-confirm .foot .ok:hover { background:#a40606; } .dialog-confirm .foot .cancel { background:#bbb; color:#333; } .dialog-confirm .foot .cancel:hover { background:#999; } .dialog-log { position:absolute; z-index:99; width:auto; padding:10px 20px; border:1px solid #e0272c; background:#ffe8e9; border-radius:3px; box-shadow:1px 1px 5px rgba(0,0,0,0.2); color:#e0272c; } .dialog-log i { position:absolute; left:15px; top:-7px; width:14px; height:7px; background:url(../images/log-arrow.png) center center no-repeat; } .dialog-layout { position:fixed; left:0; top:0; width:100%; height:100%; filter:Alpha(opacity=50); background:#000; background:rgba(0,0,0,.5); z-index:99; } .dialog-album { position:fixed; _position:absolute; width:100%; height:100%; left:0; top:0; z-index:100; display:none; } .dialog-album .layout { position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.9) !important; filter:Alpha(opacity=90); background:#000; z-index:-1; } .dialog-album .container { position:absolute; left:0; top:0; width:100%; height:100%; z-index:2; overflow:hidden; } .dialog-album .container ul { float:left; width:1000%; height:100%; position:relative; } .dialog-album .container li { float:left; width:10%; height:100%; position:relative; } .dialog-album .container .img { width:100%; height:100%; } .dialog-album .container .img img { max-height:100%; max-width:80%; width:800px; height:600px; } .dialog-album .tool .close { position:absolute; width:65px; height:35px; top:0; right:0; background:url(../images/ico-album.png) 0 -105px no-repeat; z-index:10; overflow:hidden; text-indent:-99em; opacity:0.6 !important; filter:Alpha(opacity=60); } .dialog-album .tool .close:hover { opacity:0.9 !important; filter:Alpha(opacity=90); } .dialog-album .tool .right, .dialog-album .tool .left { position:absolute; width:30px; height:30px; top:50%; margin-top:-10px; z-index:10; text-indent:-99em; overflow:hidden; background:url(../images/ico-album.png) -35px 0 no-repeat; } .dialog-album .tool .right { left:20px; background-position:-35px -35px; } .dialog-album .tool .left { right:20px; } .dialog-album .tool .right:hover { background-position:0 -35px; } .dialog-album .tool .left:hover { background-position:0 0; } .dialog-album .tool .play, .dialog-album .tool .plus { position:absolute; width:30px; height:30px; right:20px; bottom:20px; background:#CCC; z-index:10; overflow:hidden; background:url(../images/ico-album.png) 0 -70px no-repeat; overflow:hidden; text-indent:-99em; } .dialog-album .tool .play { background-position:-35px -70px; } .dialog-album .tip { position:absolute; width:50%; height:15px; left:25%; bottom:20px; z-index:10; text-align:center; } .dialog-album .tip span { display:inline-block; width:12px; height:12px; border:1px solid #aaa; border-radius:13px; background:#FFF; margin:0 5px; vertical-align:middle; cursor:pointer; } .dialog-album .tip span.cur { background:#666; } /****************************** ** liuBinAnimation ******************************/ .animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both} .animatedTow{-webkit-animation-duration:.6s;animation-duration:.6s;-webkit-animation-fill-mode:both;animation-fill-mode:both} @-webkit-keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190);animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1);animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)}}@keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190);animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1);animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)}} .zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown} @-webkit-keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}} .flipInY{-webkit-backface-visibility:visible !important;backface-visibility:visible !important;-webkit-animation-name:flipInY;animation-name:flipInY} @-webkit-keyframes pulse{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.15,1.15,1.15);transform:scale3d(1.15,1.15,1.15)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes pulse{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.15,1.15,1.15);transform:scale3d(1.15,1.15,1.15)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}} .pulse{-webkit-animation-name:pulse;animation-name:pulse} @-webkit-keyframes rubberBand{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,0.75,1);transform:scale3d(1.25,0.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,0.85,1);transform:scale3d(1.15,0.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes rubberBand{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,0.75,1);transform:scale3d(1.25,0.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,0.85,1);transform:scale3d(1.15,0.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}} .rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand} @-webkit-keyframes lightSpeedIn{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}to{-webkit-transform:none;transform:none;opacity:1}}@keyframes lightSpeedIn{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}to{-webkit-transform:none;transform:none;opacity:1}} .lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out} /****************************** ** 自定义字体 ******************************/ @font-face{ font-family: "avgr65w"; src: url("../font/avgr65w.eot"); src: url("../font/avgr65w.eot?#iefix") format("eot"), url("../font/avgr65w.ttf") format("truetype"); } /****************************** ** 兼容性 ******************************/ body { _background:url(../images/ie6.png) center center no-repeat #fff; } body > * { _display:none; }