/* 内页banner */ .inner-banner { background-size: cover; background-repeat: no-repeat; background-position: center center; } .inner-banner .cont { padding-bottom: 45.83%; position: relative; } @media (max-width: 768px){ .inner-banner .cont { padding-bottom: 45.83%; position: relative; } } /* 内容页样式 */ /*.innerSide { float: left; margin-right: 35px; width: 232px; }*/ .inner-main { margin-bottom: 4%; } .innerContent { min-height: 300px; overflow: hidden; } .detailTitle { font-size: 26px; text-align: center; margin-bottom: 1em; } .pubTime { display: block; color: #fff; font-size: 16px; text-align: center; margin-bottom: 4%; } .iCont { font-size: 16px; line-height: 1.8; } .iCont p { text-indent: 2em; margin-bottom: 1em; color: #666; } .iCont img { display: block; margin: 0 auto 0.5em; max-width: 100%; } @media (max-width: 768px) { .innerContent { padding: 15px 15px 0; } .mContent { margin: 0 -15px; } .detailTitle { font-size: 22px; } .inner-main { margin-top: 0; } } /*内页导航*/ .side-box { width: 100%; border: 3px solid #fff; padding: 2px; margin-bottom: 5%; box-sizing: border-box; } .side-box .t { background-color: #fff; color: #000; padding: 3%; text-align: center; line-height: 1.4; display: none; } .side-box .t span { display: block; font-size: 24px; } .side-box .t small { display: block; font-size: 12px; text-transform: uppercase; } .side-box .t i { display: none; } .side-nav>ul { text-align: center; } .side-nav>ul>li { display: inline-block; width: auto; min-width: 6em; margin: 0.5% 1%; text-align: center; height: 38px; line-height: 38px; font-size: 18px; white-space: nowrap; border: 1px solid #8f8f8f; } .side-nav>ul>li a { display: block; color: #666; padding: 0 5px; } .side-nav>ul>li:hover, .side-nav>ul>li.on { background-color: #b80000; border-color: #b80000; } .side-nav>ul>li:hover a, .side-nav>ul>li.on a { color: #fff; } .side-box.side-info { border-color: #3b3b3b; } .side-box.side-info .t { background-color: #3b3b3b; } .side-info .side-content { padding: 10px; font-size: 14px; line-height: 1.8; background-color: #b80000; color: #fff; } .side-info .side-img img { max-width: 100%; margin: 0 auto; display: block; } @media (max-width: 768px) { /*.innerSide{ float: none; width: 100%; margin-right: 0; }*/ .searchCtrl { display: none; } .side-info { display: none; } .side-box { border: none; padding: 0; background-color: #fff; } .side-box .t { display: block; background-color: #fff; color: #b80000; line-height: inherit; } .side-box .t small { display: none; } .side-nav { line-height: 45px; position: relative; overflow: visible; border-bottom: 1px solid #dcdcdc; } .side-nav .t { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 0 15px; font-size: 18px; } .side-nav .t i { display: block; position: absolute; right: .15rem; height: 100%; top: 0; padding: 0 .4rem 0 10px; color: #b80000; border-left: 1px solid #e6d8d8; font-size: 16px; } .side-nav .t i:after { content: ""; display: inline-block; width: 20px; height: 100%; vertical-align: middle; background: url("../Images/arrow-down.png") no-repeat center center / contain; margin-left: 10px; } .side-box .t span { font-size: 18px; } .side-nav>ul { display: none; position: absolute; top: 100%; left: 0; margin-top: 1px; width: 100%; background-color: #fff; padding: 1em; -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom: 1px solid #dcdcdc; z-index: 2; } .side-nav>ul>li { float: left; display: block; width: 48%; margin-left: 1%; margin-right: 1%; height: 40px; line-height: 40px; margin-right: 0; border-top: none; border-left: none; border-right: none; border-bottom: 1px dashed #dcdcdc; text-align: left; background-color: #fff; color: #000; padding: 0; } .side-nav ul li a { display: block; } .side-nav>ul>li:hover, .side-nav>ul>li.on { background-color: transparent; } .side-nav>ul>li:hover a, .side-nav>ul>li.on a { color: #b80000; } } /*产品列表*/ .productList li { width: 48%; margin: 0 1% 2% 1%; float: left; box-sizing: border-box; border: 1px solid #e7e7e7; } .productList li .imgBox { width: 100%; padding-bottom: 61.5%; } .productList li span { display: block; height: 40px; line-height: 40px; font-size: 14px; text-align: center; } @media (max-width: 768px) { .productList li { width: 48%; margin: 0 1% 2% 1%; } .productList li span { height: 30px; line-height: 30px; } } /*工程列表*/ .projectList li { width: 31%; margin: 0 1% 2% 1%; float: left; box-sizing: border-box; } .projectList li .imgBox { width: 100%; padding-bottom: 60%; } .projectList li .imgBox img { width: 100%; height: 100%; } .projectList li span { display: block; height: 40px; line-height: 40px; font-size: 14px; text-align: center; } @media (max-width: 768px) { .projectList li { width: 48%; margin: 0 1% 2% 1%; } .projectList.projectIndexList li:nth-child(n+3) { display: none; } .projectList li span { height: 30px; line-height: 30px; } } /*工程列表*/ .caseList li { width: 23%; margin: 0 1% 2% 1%; float: left; box-sizing: border-box; } .caseList li .imgBox { width: 100%; padding-bottom: 66.7%; } .caseList li .imgBox img { max-width: 100%; max-height: 100%; } .caseList li span { display: block; height: 40px; line-height: 40px; font-size: 14px; text-align: center; color: #666; } .caseList li:hover { border-color: #b80000; } @media (max-width: 768px) { .caseList li { width: 48%; margin: 0 1% 2% 1%; } .caseList li span { height: 30px; line-height: 30px; } } /*新闻列表*/ .newsList li { margin-bottom: 5%; padding-top: 10px; padding-bottom: 10px; color: #666; } .newsList li a{ color: #666; } .newsList li .imgBox { float: left; width: 402px; height: 242px; margin-right: 3%; } .newsList li .imgBox img { width: 100%; height: 100%; } .newsList li .cont { overflow: hidden; color: #222; position: relative; } .newsList li .cont .newsBottom{ position: absolute; bottom: 0; left: 0; width: 100%; } .newsList li .cont .newsTime { float: left; font-size: 18px; } .newsList li .cont .newsMore { float: right; } .newsList li .cont .newsMore a{ padding: .5em 1em; background-color: #b80000; color: #fff; border-radius: 2em; display: block; line-height: 1; font-size: 16px; } .newsList li .cont .newsTitle { overflow: hidden; font-weight: bold; font-size: 20px; } .newsList li .cont .newsTitle a { color: #000; } .newsList li .cont .newsTitle a:hover { color: #8e0100; } .newsList li .cont .newDetail { font-size: 14px; padding-top: 3%; padding-bottom: 45px; margin-top: 3%; line-height: 1.6em; max-height: 6em; line-height: 2em; overflow: hidden; border-top: 2px dotted #999; } @media (max-width: 768px) { .newsList li .cont { height: 84px; } .newsList li { position: relative; } .newsList li .imgBox { width: 140px; height: 84px; } .newsList li .cont .newsMore { display: none; } .newsList li .cont .newsTime.style2 { float: none; position: absolute; bottom: 0; right: 0; font-size: 12px; } .newsList li .cont .newsTitle { line-height: 1.6em; max-height: 3.2em; overflow: hidden; font-weight: normal; } .newsList li .cont .newDetail { display: none; } } /*产品详情*/ .bigImgList { width: 100%; position: relative; border: 1px solid #e5e5e5; margin-right: 20px; float: left; } .bigImgList li .imgBox { width: 100%; padding-bottom: 51.6%; position: relative; } .bigImgList li .imgBox img { position: absolute; max-width: 100%; max-height: 100%; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .bigImgList .prev, .bigImgList .next { position: absolute; left: 3%; top: 50%; margin-top: -25px; display: block; width: 32px; height: 40px; background: url(../images/slider-arrow.png) -110px 5px no-repeat; filter: alpha(opacity=50); opacity: 0.5; z-index: 3; } .bigImgList .next { left: auto; right: 3%; background-position: 8px 5px; } .bigImgList .prev:hover, .bigImgList .next:hover { filter: alpha(opacity=100); opacity: 1; } .pdtDetail h1 { font-size: 24px; color: #1051c8; } .pdtDetail dt { float: left; clear: left; margin-right: 10px; } .pdtDetail dd { float: left; } .MvcPagerCtrl { text-align: center; } .MvcPagerCtrl a { padding: .1em 0.5em; border: 1px solid #0e112f; font-size: 16px; display: inline-block; } .MvcPagerCtrl a.on { background-color: #0e112f; color: #fff; } h1.pdtName { color: #b80000; font-size: 26px; border-bottom: #d9d9d9 dashed 1px; height: 30px; line-height: 30px; padding-bottom: 1em; text-align: center; } .ptdInfo { position: relative; margin-top: 30px; margin-bottom: 24px; } .ptdInfo:before { content: ""; position: absolute; display: block; top: 50%; left: 0; width: 100%; height: 2px; background: #b80000; z-index: -1; } .pdtDetail { border-bottom: 1px solid #ddd; margin-bottom: 2%; } .pdtDetail li { width: 25%; float: left; margin-right: 1em; padding-bottom: 2%; } .ptdInfo span.title { padding: 5px 10px; background-color: #b80000; font-size: 16px; color: #fff; display: inline-block; } .buyPdt { background-color: #f0f0f0; height: 40px; line-height: 40px; border-radius: 5px; margin-top: 20px; margin-bottom: 20px; text-indent: 1em; color: #1051c8; font-size: 16px; } .buyPdt .pdtTitle { color: #1051c8; line-height: 40px; } .msgForm { width: 400px; max-width: 100%; } .msgForm p { text-indent: 0 !important; } .msgForm p.notPadding { padding: 0; } @media (max-width: 768px) { .bigImgList { width: 100%; } .pdtDetail li { width: 100%; float: none; } } /* 当前位置 */ .location { font-size: 14px; border-bottom: solid 1px #c5c5c5; line-height: 30px; color: #666; padding: 15px 0; margin-bottom: 4%; } .location-main { float: left; } .location-main:before { content: ""; display: inline-block; width: 1em; height: 1em; background: url("../Images/location.png") no-repeat center center / contain; vertical-align: middle; } .location a { margin: 0 .2em; color: #666; } .location span { color: #444; } .phoneBtn { float: right; font-size: 0; height: 30px; } .phoneBtn input { height: 30px; font-size: 14px; font-family: "微软雅黑"; border: 1px solid #b3b3b3; padding: 2px 10px; color: #b3b3b3; background-color: #eeeeee; box-sizing: border-box; } .phoneBtn input.top_tel { border-radius: 30px 0 0 30px; border-right: none; width: 200px; } .phoneBtn input.phone_submit { border-radius: 0 30px 30px 0; cursor: pointer; } .phoneBtn input.phone_submit:hover { border-color: #b80000; color: #b80000; } @media (max-width: 768px) { .location { display: none; } .phoneBtn { float: none; display: none; } } /* 当前位置end */ /*搜索框*/ .searchCtrl_btn { position: relative; margin-bottom: 10px; } .searchCtrl_btn #searchBtn, .searchCtrl_btn #searchKeyword { display: block; box-sizing: border-box; height: 30px; line-height: 30px; font-family: "微软雅黑"; font-size: 14px; } .searchCtrl_btn #searchBtn { position: absolute; width: 4em; right: 0; bottom: 0; background-color: #b80000; border: 0; color: #fff; } .searchCtrl_btn #searchKeyword { width: 100%; padding-right: 4em; } /*搜索框end*/ /*留言表单*/ .msgForm { width: 500px; max-width: 100%; } .msgForm input[type=text], .msgForm textarea { width: 100%; height: 30px; line-height: 30px; vertical-align: text-top; border: 1px solid #ccc; -webkit-box-sizing: border-box; box-sizing: border-box; } .msgForm>div { position: relative; margin-bottom: 18px; padding-left: 4em; padding-right: 1em; font-size: 14px; } .msgForm>div span { position: absolute; display: block; top: 0; left: 1em; } .msgForm textarea { height: 100px; } .msgForm .must_text:before { content: "*"; color: #f99e00; position: absolute; right: 0; top: 0; } .msgForm label.error { position: absolute; left: 3em; top: 30px; color: red; } .msgForm .btn-box { text-align: center; } .msgForm .btn-box input.msg_btn { height: 30px; line-height: 30px; width: 90px; border-radius: 12px; border: 0; margin: 0 pxFrem(10); color: #fff; cursor: pointer; font-size: pxFrem(30); } .msgForm .btn-box input.msg_btn[type="button"], .msgForm .btn-box input.msg_btn[type="submit"] { background: #b80000; } .msgForm .btn-box input.msg_btn[type="reset"] { background: url("../Images/reset-bg.jpg"); background-size: auto 100%; } .msgForm .btn-box input.msg_btn[type="button"]:hover, .msgForm .btn-box input.msg_btn[type="submit"]:hover { background: #fb3f3f; } /*留言表单end*/ /*上下页按钮*/ .prevNextBtn { margin-top: 3em; font-size: 16px; } .prevNextBtn .prevBtn { float: left; width: 40%; } .prevNextBtn .nextBtn { float: right; width: 40%; } @media (max-width: 768px) { .prevNextBtn .prevBtn, .prevNextBtn .nextBtn { float: none; width: 100%; } } /*上下页按钮end*/ /* 联系我们 */ .innerContact { margin-bottom: 8%; position: relative; } .innerContact .contactBox{ float: left; width: 33%; box-sizing: border-box; } .innerContact .contactBox:before{ content: ""; position: absolute; display: block; width: 1px ; height: 100%; top: 0; background-color: #000; } .innerContact .contactBox.info{ padding-right: 4%; font-size: 14px; color: #666666; line-height: 1.6; } .innerContact .contactBox.info:before{ left: 33%; } .innerContact .contactBox.code:before{ left: 66%; } .innerContact .contactBox.tel:before{ display: none; } .innerContact .contactBox.code{ padding-left: 4%; padding-right: 4%; text-align: center; } .innerContact .contactBox.tel{ padding-left: 4%; padding-right: 4%; color: #b80000; text-align: center; } .innerContact .contactBox.tel .telBox{ display: inline-block; text-align: left; } .innerContact .contactBox.tel span{ display: block; font-size: 20px; margin-top: 20px; } .innerContact .contactBox.tel i{ display: block; font-size: 36px; line-height: 1; margin-top: 10px; } .innerContact .contactBox.code img{ display:block; margin: 0 auto; } .contactMap { width: 100%; height: 348px; } .contactIndexMap { float: left; width: 56%; height: 348px; } .innerLeave { float: right; width: 40%; } @media (max-width: 768px) { .contactIndexMap, .innerLeave { float: none; width: 100%; margin-bottom: 6%; } .innerContact .contactBox.info{ float: none; width: 100%; margin-bottom: 30px; padding-right: 0; } .innerContact .contactBox.code, .innerContact .contactBox.tel{ width: 48%; display: inline-block; float: none; vertical-align: bottom; } .innerContact .contactBox:before{ display: none; } .innerContact .contactBox.tel span{ font-size: 14px; } .innerContact .contactBox.tel i{ font-size: 18px; } .innerContact .contactBox.code span i{ display: block } } /* 联系我们end */ /* 产品首页 */ .productIndexTitle { position: relative; margin-top: 30px; margin-bottom: 24px; } .productIndexTitle:first-child { margin-top: 0; } .productIndexTitle:before { content: ""; position: absolute; display: block; top: 50%; left: 0; width: 100%; height: 2px; background: #b80000; z-index: -1; } .productIndexTitle a { padding: 5px 10px; background-color: #b80000; font-size: 16px; color: #fff; display: inline-block; } .productIndexTitle a i { font-size: 13px; margin-left: 0.5em; } /*领袖致辞*/ .speech { overflow: hidden; } .speech .img { float: left; margin-right: 4%; } .speech .speech-text { overflow: hidden; color: #666; font-size: 14px; line-height: 2; } .speech .speech-text p { margin-bottom: 2em; text-indent: 2em; } .speach-bottom { border: 1px solid #999999; padding: 2em; font-size: 14px; color: #666666; line-height: 2; margin-top: 4%; } @media (max-width: 768px) { .speech .img { float: none; margin-left: 0; margin: 0 auto; } .speech .speech-text p { margin-bottom: 1em; } } /*领袖致辞 end*/ /*品牌文化*/ .culture-top { text-align: center; color: #666; font-size: 20px; line-height: 2; } .culture-bottom { color: #666; font-size: 14px; line-height: 2; margin-top: 7%; } .culture-bottom p { margin-bottom: 1em; } .culture-bottom .strong { font-size: 1.6em; } .culture-bottom img { float: right; margin-left: 4%; } @media (max-width: 768px) { .culture-bottom img { float: none; margin-left: 0; } } /*品牌文化 end*/ /*join-support*/ .join-support { overflow: hidden; } .join-support ul { margin: 0 -60px; } .join-support li { float: left; width: 33.3%; padding: 0 60px; box-sizing: border-box; margin-bottom: 60px; } .join-support li .t { position: relative; font-size: 20px; color: #333; padding-bottom: 1em; border-bottom: 1px solid #999999; } .join-support li .t:before { position: absolute; content: ""; display: block; width: 2em; height: 3px; left: 0; bottom: 0; margin-bottom: -2px; background-color: #b80000; } .join-support li .cont { font-size: 14px; color: #666; line-height: 1.8; margin-top: 2em; } @media (min-width: 769px) { .join-support li:nth-child(3n+1) { clear: left; } } @media (max-width: 768px) { .join-support ul { margin: 0 -15px; } .join-support li { width: 50%; padding: 0 15px; margin-bottom: 30px; } .join-support li:nth-child(2n+1) { clear: left; } .join-support li:nth-child(9) { width: 100%; } .join-support li .t { font-size: 18px; } .join-support li .cont { margin-top: 1em; } } /*join-support end*/ /*join-condition*/ .join-condition { margin-top: 6%; } .join-condition .img { float: right; margin-left: 40px; width: 50%; padding-bottom: 40%; background: url("../Images/join-condition.jpg") no-repeat center center / 100% auto; } .join-condition .img img { width: 100%; } .join-condition .cont { overflow: hidden; color: #666; } .join-condition .cont .t { font-size: 20px; line-height: 1.6em; } .join-condition .cont ul { margin-top: 20px; } .join-condition .cont li { font-size: 14px; line-height: 2em; } @media (max-width: 768px) { .join-condition .img { float: none; margin-left: 0; width: 100%; margin-bottom: 15px; } .join-condition .cont .t { font-size: 16px; } .join-condition .cont li { font-size: 12px; } } /*join-condition end*/ /*join-process*/ .join-process { margin-top: 6%; } .join-process .join-list { width: 50%; float: left; } .join-process .join-list ul { margin-right: -8%; } .join-process li { width: 15%; margin-right: 10%; float: left; margin-bottom: 7%; } .join-process li .imgBox { width: 100%; padding-bottom: 100%; border: 6px solid #cccccc; background-color: #999999; border-radius: 50%; } .join-process li .imgBox img { max-width: 60%; max-height: 60%; } .join-process li .imgBox:before { content: ""; position: absolute; display: block; width: 30%; height: 100%; background: url("../Images/join-process-icon.png") no-repeat right center / contain; left: 100%; top: 0; margin-left: 16%; } .join-process li span { color: #666; display: block; text-align: center; padding: 6px; width: 100%; font-size: 12px; margin-top: 4%; } .join-process li:nth-child(n+5) .imgBox:before { background-image: url("../Images/join-process-icon2.png"); } .join-process li:nth-child(4) .imgBox:before { background: url("../Images/join-process-icon3.png") no-repeat center center / contain; height: 30%; width: 100%; top: 100%; left: 0; margin-left: 0; margin-top: 3em; } .join-process li:nth-child(8) .imgBox:before { display: none; } .joinForm { float: right; width: 46%; } .joinForm label { display: block; width: 44%; margin: 0 3% 2%; float: left; } .joinForm .notAfter label { width:94%; } .joinForm label span { display: block; color: #666; font-size: 14px; line-height: 2; } .joinForm label input { width: 90%; font-size: 14px; height: 2.5em; line-height: 2.5em; padding: .5em; box-sizing: border-box; } .joinForm .notAfter label textarea { display: block; width: 96%; line-height: 2em; height: 8em; padding: .5em; box-sizing: border-box; } .joinForm .btn-box { text-align: center; } .joinForm .btn-box input.msg_btn { height: 30px; line-height: 30px; width: 90px; border-radius: 12px; border: 0; color: #fff; cursor: pointer; } .joinForm .btn-box input.msg_btn[type="button"], .joinForm .btn-box input.msg_btn[type="submit"] { background: #b80000; } .joinForm .btn-box input.msg_btn[type="button"]:hover, .joinForm .btn-box input.msg_btn[type="submit"]:hover { background: #fb3f3f; } @media (max-width: 768px) { .join-process .join-list, .joinForm { float: none; width: 100%; } .joinForm label input, .joinForm .notAfter label textarea { width: 100%; } } /*join-process end*/ .detailVideo video { display: block; width: 800px; max-width: 90%; margin: 0 auto; background-color: #000; } /*branch*/ .branch{ position: relative; } .branch .catalog-scroller{ position: absolute; top: 0; padding-left: 20px; padding: 10px 0 10px 30px; font-size: 12px; width: 120px; height: 100%; overflow-y: auto; box-sizing: border-box; } .branch .catalog-scroller::-webkit-scrollbar { display: none; } .catalog-title{ margin-bottom: 5px; } .branch .catalog-scroller.settop{ position: fixed; } .side-bar{ position: absolute; left: 0; top: 0; width: 0; height: 100%; background-color: #eaeaea; border: 1px solid #eaeaea; border-top: 0; border-bottom: 0; left: 4px; } .pointer { position: absolute; display: block; width: 10px; height: 10px; cursor: pointer; margin-top: 4px; left: 0; background-color: #eaeaea; border-radius: 50%; } .catalog-title.on .pointer{ background-color: red; } .catalog-title.on .title-link{ color: red; } .branch .list{ padding-left: 200px; font-size: 14px; } .branch .list li{ margin-bottom: 50px; } .branch .list li .name{ font-size: 1.6em; margin-bottom: 15px; } @media (max-width: 768px) { .branch .list{ padding-left: 130px; font-size: 14px; } } /*branch end*/