@charset "utf-8"; #header{position:fixed; z-index:2; top:0; left:0; width:100%; min-width:1200px; background:url(../../Base/img/bg30.png) left top repeat; -webkit-transition:all 1s; -moz-transition:all 1s; -ms-transition:all 1s; -o-transition:all 1s; transition:all 1s; } #header.headerTwo{background-image: url(../../Base/img/bg60.png); } #content{width:100%; max-width:100%; margin:0; padding: 0;} /*导航菜单*/ .mainNav .a1{color: #e5f4ff;} .mainNav .a1:hover, .mainNav .on1 .a1{font-weight: bold; color:#fff;} .headerTwo .mainNav .a1{color: #fff;} .topNav .icon{border-bottom-color: white} #subNav{position: fixed; border: none;} .topLinks dt a{border-color: #f6f6f6; background-color: #f6f6f6;}/*顶部-链接*/ #contact .bd p{background-image: url(../../Base/img/ind-contactIcon.png);} /* 背景设置 */ .section{background-repeat:no-repeat; background-position:center top; background-size:cover;} .section .siteWidth{padding-top:100px;} #pageAbout{background-image: url(../../Base/img/demoPic/ind-bg1.jpg);} #pageNews{background-image: url(../../Base/img/demoPic/ind-bg2.jpg);} #pageBusiness{background-image: url(../../Base/img/demoPic/ind-bg3.jpg);} #pageProject{background-image: url(../../Base/img/demoPic/ind-bg4.jpg);} #pageOther{background-image: url(../../Base/img/demoPic/ind-bg5.jpg);} /*通用-标题*/ .section .mHd{overflow: hidden;} .section .mHd h3{line-height: 50px; font-size: 48px; font-weight: bold; color: #0068af;} .section .mHd h3 a{color: #0068af;} .section .mHd p{margin-top: 10px; line-height: 30px; text-transform:uppercase; font-size: 14px; color: #8c969c;} /* 第一屏 焦点图 ------------------------------------------*/ #focusPic{height:100%; margin-bottom: 0;} #focusPic .bd{height:100%;} #focusPic .bd li{display:block; width:100%; height:100%; background-size:cover !important;} #focusPic .bd li .link{display:block;} #focusPic .con{display:none;} #focusPic .hd{display: none; right:0; bottom:15%; width:100%; text-align:center;} #focusPic .hd ul{display:inline-block; *display: inline; float:none; margin:0 auto;text-align:center; } #focusPic .hd li{line-height:7px; width:30px; height:7px; margin:0 5px; border:3px solid #555; border-radius:0;background:none; } #focusPic .hd li.on{border-color:#1ccbc2;background:none; } #focusPic .prev,#focusPic .next{line-height:48px; position:absolute; z-index:1; top:50%; float:left; width:62px; height:48px; margin-top:-24px; background:url(../../Base/img/ind-focusBtn.png) center top no-repeat;} #focusPic .prev{left:50%; margin-left:-600px;} #focusPic .next{right:50%; margin-right:-600px; background-position:center -50px;} #focusPic .prev:hover{background-position: center -100px;} #focusPic .next:hover{background-position: center -150px;} .mouseTip{position: absolute; z-index: 2; left: 50%; bottom: 50px; width: 30px; height: 54px; line-height: 54px; float: left; margin-left: -15px; overflow: hidden; text-indent: -9999px; background: url(../../Base/img/ind-gdsbIcon.png) center top no-repeat; cursor: pointer;} /* 第二屏 Bwin体育亚洲官网 ------------------------------------------*/ #pageAbout{} .aboutNode{width: 695px; float: right; margin: -90px 0 0 90px;} .aboutNodeList{overflow: hidden; padding: 90px 25px 120px; background: url(../../Base/img/ind-aboutBg.jpg) center bottom no-repeat;} .aboutNodeList li{position: relative; z-index: 1; width: 150px; height: 150px; float: left; margin: 30px 32px 0; text-align: center;} .aboutNodeList li.li1{display: none;} .aboutNodeList li a{position: relative; z-index: 1; display: block; padding: 94px 0 26px; height: 30px; line-height: 30px; font-size: 16px; color: white; overflow: hidden; background:url(../../Base/img/bg40.png) left top repeat;} .aboutNodeList li a:hover{text-decoration: none; background-image: url(../../Base/img/bg60.png);} .aboutNodeList li .icon{position: absolute; z-index: 1; left: 0; top:35px; width: 100%; height: 45px; line-height: 45px; float: left; overflow: hidden; background: url(../../Base/img/ind-aboutIcon.png) center top no-repeat; -webkit-transition:all 1s; -moz-transition:all 1s; -ms-transition:all 1s; -o-transition:all 1s; transition:all 1s; } .aboutNodeList li a:hover .icon{ -webkit-transform:rotateY(360deg); -moz-transform:rotateY(360deg); -ms-transform:rotateY(360deg); -o-transform:rotateY(360deg); transform:rotateY(360deg); } .aboutNodeList li.li2 .icon{background-position: center top;} .aboutNodeList li.li3 .icon{background-position: center -46px;} .aboutNodeList li.li4 .icon{background-position: center -96px;} .aboutNodeList li.li5 .icon{background-position: center -150px;} .aboutNodeList li.li6 .icon{background-position: center -200px;} .aboutNodeList li.li7 .icon{background-position: center -248px;} /*集团统计信息*/ .countList{overflow: hidden; margin-top: 80px;} .countList li{width: auto; float: left; padding-left: 15px; margin-right: 35px; text-align: right; font-weight: bold; font-family: Arial;} .countList li.last{float: right; margin-right: 0; padding-left: 0;} .countList li .num{font-size: 48px; line-height: 50px; color: #030504;} .countList li .tip{margin-top: 8px; font-size: 14px; line-height: 24px; color: #333;} /*集团简介*/ .aboutIntro{overflow: hidden; margin: 10px 0; font-size: 15px; text-indent: 2em; line-height: 30px; color: #999; text-align:justify;} /*集团视频宣传*/ .aboutVideo{position: relative; z-index: 1; overflow: hidden; margin: 35px auto 0; padding:20px 0 0 65px; text-align: center;} .aboutVideo .border{position: absolute; z-index: 1; left: 142px; top: 0; width: 264px; height: 235px; border: 1px solid #dcdcdc;} .boxVide{position: relative; z-index: 2;} .aboutVideo video{width: 328px; height: 240px;} /* 第三屏 新闻中心 ------------------------------------------*/ #pageNews{} #pageNews .mHd h3{color: white;} #pageNews .mHd p{color: #98c1df;} /*新闻中心-切换框*/ .newsBox{margin-top: 60px;} .newsBox .hd{text-align: center; line-height: 48px; font-size: 20px; color: white;} .newsBox .hd a{display: inline-block; *display: inline; margin:0 18px; height: 48px; line-height: 48px; padding-bottom: 2px; color: white;} .newsBox .hd a:hover, .newsBox .hd a.on{padding-bottom: 0; font-weight: bold; text-decoration: none; border-bottom: 2px solid #fff;} .newsBox .bd{padding: 35px 0 0; height: 270px;} .newsBox .btn{overflow: hidden; margin: 50px auto 0; text-align: center;} .newsBox .btn .more{display: inline-block; *display: inline; width: auto; padding: 0 20px; height: 34px; line-height: 34px; border: 1px solid white; font-size: 15px; color: white;} .newsBox .btn .more:hover{text-decoration: none; background-color: #fff; color: #0068af;} /*图文-日历式列表*/ .twInfoList{height: 270px; overflow: hidden;} .twInfoList li{position: relative; z-index: 1; width: 330px; float: left; margin-right: 105px;} .twInfoList li .pic img{display: block; width: 100%; height: 184px; background-color: #f0f0f0;} .twInfoList li .con{padding:8px 20px; height: 70px; line-height: 70px; background-color: #fffff9;} .twInfoList li .title{font-size: 16px; height: 24px; line-height: 24px; overflow: hidden;} .twInfoList li .intro{overflow: hidden; margin-top: 5px; height: 40px; font-size: 12px; line-height: 20px; color: #999;} .twInfoList li .calendar{position: absolute; z-index: 1; right: 0; top: 140px; width: 54px; height: 44px; line-height: 14px; font-size: 10px; color: white; text-align: center; background:url(../../Base/img/bg60.png) left top repeat;} .twInfoList li .calendar em{display: block; margin-top: 5px; font-size: 16px; line-height: 20px;} .dateInfoList{overflow: hidden; margin-right: -40px;} .dateInfoList ul{width: 580px; float: left; margin:-38px 40px 0 0; overflow: hidden;} .dateInfoList li{height: 70px; padding: 25px 20px; margin:38px 0 0 0; overflow: hidden; background-color: #fff;} .dateInfoList li .calendar{width: 70px; height: 70px; float: left; margin-right: 20px; overflow: hidden; line-height: 20px; text-align: center; font-size: 12px; color: #666; background-color: #ededed;} .dateInfoList li .calendar em{display: block; margin-top: 8px; height: 36px; line-height: 36px; font-size: 32px; color: #666;} .dateInfoList li .con{overflow: hidden;} .dateInfoList li .title{font-size: 15px; line-height: 22px; color: #333;} .dateInfoList li .intro{margin-top: 8px; line-height: 20px; font-size: 14px; color: #666;} .dateInfoList li:hover .calendar{color: white; background-color: #e2b700;} .dateInfoList li:hover .calendar em{color: white;} /*左右箭头&实际宽度*/ .twInfoBox{width: 1200px; position: relative; z-index: 1;} .twInfoBox .tempWrap{width: 1200px !important;} .twInfoBox .prevBtn, .twInfoBox .nextBtn{position: absolute; z-index: 1; top: 50%; margin-top: -20px; width: 30px; height: 40px; float: left; overflow: hidden; } .twInfoBox .prevBtn{left: -50px;} .twInfoBox .nextBtn{right: -50px;} .twInfoBox .prevBtn i, .twInfoBox .nextBtn i{width: 100%; height: 24px; line-height: 24px; float: left; overflow: hidden; margin-top: 8px; background: url(../../Base/img/btnIcon.png) center top no-repeat;} .twInfoBox .nextBtn i{background-position: center -24px;} .twInfoBox .prevBtn:hover, .twInfoBox .nextBtn:hover{background: url(../../Base/img/bg40.png) left top repeat;} /* 第四屏 业务领域 ------------------------------------------*/ #pageBusiness .mHd h3{color: #0068af;} .businessList{overflow: hidden; margin-top: 80px; padding: 0 0 80px 54px; height: 349px; overflow: hidden;} .businessList li{position: relative; z-index: 1; width: 278px; height: 349px; float: left; overflow: hidden;} .businessList li .pic img{display: block; width: 100%; height: 349px; background-color: #fafafa; -webkit-transition-duration:1s; -moz-transition-duration:1s; -ms-transition-duration:1s; -o-transition-duration:1s; transition-duration:1s; } .businessList li .title, .businessList li .info{position: absolute; z-index: 1; left: 0; display: table; vertical-align: middle; text-align: center; width: 100%; height: 349px; -webkit-transition:all 1s; -moz-transition:all 1s; -ms-transition:all 1s; -o-transition:all 1s; transition:all 1s; } .businessList li .title{top: 0;} .businessList li .info{top:349px;} .businessList li .bg{position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 349px; float: left; overflow: hidden; background-color: #000; } .businessList li.li2 .bg, .businessList li.li6 .bg, .businessList li.li4 .bg{background-color: #00426f;} .businessList li .title .bg{opacity: .75; filter: alpha(opacity=75);} .businessList li .info .bg{opacity: .9; filter: alpha(opacity=85);} .businessList li .tit, .businessList li .con{position: relative; z-index: 2; height: 349px; display: table-cell; vertical-align: middle;} .businessList li .tit{line-height: 40px; font-size: 20px; color: white; font-weight: bold; text-align: center;} .businessList li .icon{display: block; margin:20px 0; height: 44px; line-height: 44px; background: url(../../Base/img/ind-businessIcon.png) center top no-repeat;} .businessList li.li2 .icon{background-position: center -44px;} .businessList li.li3 .icon{background-position: center -88px;} .businessList li.li4 .icon{background-position: center -132px;} .businessList li.li5 .icon{background: url(../../Base/img/transport-services2.png) center top no-repeat;background-size: 32px;} .businessList li.li6 .icon{background-position: center -176px;} .businessList li .intro{text-indent: 2em; padding: 0 30px; font-size: 16px; line-height: 30px; text-align: left; color: #e0e0e0;} .businessList li .more{display: inline-block; *display: inline; margin-top: 25px; width: 34px; height: 34px; line-height: 34px; text-indent: -9999px; overflow: hidden; background: url(../../Base/img/ind-businessIcon.png) left -220px no-repeat;} .businessList li:hover .title{top: -349px;} .businessList li:hover .info{top: 0;} .businessList li:hover .pic img{webkit-transform:scale(1.1);transform:scale(1.1);} .businessBox{position: relative;z-index: 1;overflow: hidden;margin-top: 60px;padding: 0 0 124px 88px;background: url(../../Base/img/ind-pageProjectBg.png) left top no-repeat;} .businessBox .prev, .businessBox .next{position: absolute; z-index: 1; right: 0; top: 380px; width: 50px; height: 30px; line-height: 30px; float: left; overflow: hidden; background: #ececec url(../../Base/img/businessBtnIcon.png) center 9px no-repeat;} .businessBox .prev{margin-right: 60px;} .businessBox .next{background-position: center -21px;} .businessBox .prev:hover, .businessBox .next:hover{background-color: #dcd9d9;} .businessBox .tempWrap{width:100%!important;} /* 第五屏 建设项目 ------------------------------------------*/ #pageProject{} #pageProject .mHd h3{color: #030504;} .projectBox{position: relative; z-index: 1; height: 372px; padding: 60px 50px 50px; margin: 50px auto 0; text-align: center; background-color: white;} /*.projectBox .prevBtn, .projectBox .nextBtn{position: absolute; z-index: 1; top: 50%; width: 36px; height: 36px; float: left; margin-top: -18px; overflow: hidden; background-color: #e2b700; background: #e2b700 url(../../Base/img/ind-projectBtn.png) right 14px no-repeat;} .projectBox .prevBtn{left: -18px;} .projectBox .nextBtn{right: -18px; background-position: left -26px;} .projectBox .prevBtn:hover, .projectBox .nextBtn:hover{background-color: #cba400;}*/ .projectBox .prevBtn, .projectBox .nextBtn{position: absolute; z-index: 1; top: 50%; margin-top: -20px; width: 30px; height: 40px; float: left; overflow: hidden; } .projectBox .prevBtn{left: 5px;} .projectBox .nextBtn{right: 5px;} .projectBox .prevBtn i, .projectBox .nextBtn i{width: 100%; height: 24px; line-height: 24px; float: left; overflow: hidden; margin-top: 8px; background: url(../../Base/img/ind-blueBtnIcon.png) center top no-repeat;} .projectBox .nextBtn i{background-position: center -24px;} .projectBox .prevBtn:hover, .projectBox .nextBtn:hover{background: url(../../Base/img/bg40.png) left top repeat; border-radius: 2px;} .projectBox .moreBtn{margin-top: 15px;} .projectBox .picList{overflow: hidden; height: 318px;} .projectBox .picList li{width: 320px; float: left; margin-right: 70px; text-align: left;} .projectBox .picList li .pic{overflow: hidden;} .projectBox .picList li .pic img{display: block; width: 320px; height: 236px; margin: 0; padding: 0; border: none; background-color: #fafafa;} .projectBox .picList li .title{padding-top: 20px; height: 32px; line-height: 32px; font-size: 16px;} .projectBox .picList li .date{position: relative; z-index: 1; display: inline-block; *display: inline; line-height: 30px; height: 30px; font-size: 12px; color: #999;} .projectBox .picList li .date::after{position: absolute; z-index: 1; left: 0; top: 0; content: ''; width: 30%; height: 1px; line-height: 1px; float: left; background-color: #cfcfcf;} .projectBox .tempWrap{width: 1100px !important;} /* 第六屏 底部信息 ------------------------------------------*/ /*底部logo*/ #footerLogo a{background-image: url(../../Base/img/ind-footerLogo.png);} /*底部-通用框*/ .footerBox .hd{color: white;} .footerBox .hd::after{background-color: #9dc2da;} /*联系我们*/ #contact .bd{color: white;} #contact .bd p{background-image: url(../../Base/img/ind-contactIcon.png);} /*友情链接*/ #footerLinks{width: 274px;} /* 友情链接模拟下拉 */ #footerLinks dl dt{font-size:14px; line-height:20px; position:relative; overflow:hidden; height:20px; padding: 7px 32px 7px 0; cursor:pointer; color:#666; background:#fff; border-color: #fff;} #footerLinks dd li:hover{background-color:#f1f1f1;} /*友情链接*/ #share .bd .tit{color: white;} /*版权信息*/ .copyRight{ color: white; border-top: 1px solid #255982;} .copyRight a{ color: white; } .copyRight::before{position: absolute; z-index: 1; left: 0; top: 0; display: block; content: ""; width: 100%; height: 1px; line-height: 1px; float: left; overflow: hidden; background-color: #fff; opacity: .2; filter: alpha(opacity=20);} /* 媒体查询,根据分辨率比例(特殊分辨率 1280/800 2560/1600) 重定义css */ @media screen and (device-aspect-ratio:8/5) { #fp-nav.fp-right{right: 0 !important;} /* 第二屏 Bwin体育亚洲官网 ------------------------------------------*/ .aboutNodeList{padding: 50px 25px 80px;} .aboutIntro{line-height: 20px;} .aboutVideo{margin-top: 10px;} /* 第三屏 新闻中心 ------------------------------------------*/ /*新闻中心-切换框*/ .newsBox{margin-top: 20px;} .newsBox .bd{padding-top: 20px;} .newsBox .btn{margin-top: 20px;} /* 第四屏 业务领域 ------------------------------------------*/ .businessList{margin-top: 30px;padding-bottom: 50px;} /* 第五屏 建设项目 ------------------------------------------*/ .projectBox{padding: 30px 50px 20px; margin-top: 20px;} } /*-- 颜色代码 #0068B7 深色标题 #ddd 淡色边框 --*/