.main-conter { width: 73.2%; min-width: 1000px; margin: 0 auto; position: relative; z-index: 9; background: #fff; border-bottom: 1px solid #dedddd; box-shadow:2px 2px 3px #dedddd; } @media screen and (max-width: 1199px) and (min-width: 768px) { .main-conter { min-width: 0; width: 100%; padding: 0 40px; } } @media screen and (max-width: 767px) { .main-conter { min-width: 0; width: 100%; padding: 0 0.4rem; } } /***** 内页-banner *****/ .banner { width: 100%; height: 440px; display: block; position: relative; overflow: hidden; z-index: 1; } .banner img { width: 1920px; height: 440px; display: block; margin: 0 auto; position: absolute; left: 50%; top: 50%; margin: -220px 0 0 -960px; z-index: 1; } @media screen and (max-width: 991px) { .banner { /*height:248px;*/ height: auto; } .banner img { position: relative; left: 0; top: 0; margin: 0 auto; width: 100%; height: auto; } } /***** 二级导航 *****/ .pc-level2 { width: 100%; height: 55px; display: block; background: url(../images/bg_tmw90.png); border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; margin: -55px auto 0px; overflow: hidden; padding: 0 30px; border-bottom: 1px solid #dedddd; box-shadow:2px 0px 3px #dedddd; } .pc-level2 .title { width: 140px; float: left; text-align: center; font-size: 1.25em; line-height: 55px; color: #212121; font-weight: bold; margin-right: 30px; } .pc-level2 .title a { color: #212121; } .pc-level2 .level2 { font-size: 20px; float: left; width: auto; white-space: nowrap; } .pc-level2 .level2 a { font-size: 0.875em; line-height: 55px; color: #333333; padding: 0 15px; float: left; } .pc-level2 .level2 a.on, .pc-level2 .level2 a:hover { background: #005ca2; color: #fff; } /********* 面包屑导航 *********/ .pc-crumbs { height: 38px; display: block; background: url(../images/bg_tmw90.png); border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; margin: 0 30px; overflow: hidden; text-align: right; font-size: 0.75em; line-height: 38px; color: #333333; margin-bottom: 2em; } .pc-crumbs a { color: #333333; } .pc-crumbs a.on, .pc-crumbs a:hover { color: #005ca2; } /********** 三级导航 **********/ .pc-level3 { width: 100%; overflow: hidden; margin: 0 auto 20px; padding: 0 30px; } .pc-level3 a { width: 140px; height: 40px; display: block; float: left; margin-right: 20px; background: #d3d3d3; font-size: 0.875em; line-height: 40px; color: #333333; text-align: center; } .pc-level3 a.on, .pc-level3 a:hover { background: #1a5391; color: #fff; } /******* 走进佐力-精善文化-经营理念 *******/ .philosophy-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 13px 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .philosophy-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .philosophy-box { padding: 0 0 45px; } } .philosophy-box .conter { width: 100%; background: #f7f3f0; padding: 8px 0 81px; overflow: hidden; } @media screen and (max-width: 767px) { .philosophy-box .conter { padding: 56px 0 100px; } } .philosophy-box .word { width: 40%; font-size: 1.125em; line-height: 2.778em; color: #666666; text-align: center; display: table-cell; vertical-align: middle; white-space: nowrap; padding: 0 10px; } @media screen and (max-width: 767px) { .philosophy-box .word { width: 100%; display: block; font-size: 1em; line-height: 1.875em; padding-bottom: 42px; } } .philosophy-box .image { width: 53.2%; display: block; display: table-cell; overflow: hidden; margin: 0 auto; } .philosophy-box .image img { width: 100%; max-width: 100%; display: block; margin: 0 auto; } @media screen and (max-width: 767px) { .philosophy-box .image { width: 83%; display: block; } .philosophy-box .image img { width: 100%; } } /******** 走进佐力-董事长致辞 ********/ .chairman-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 30px; background: #fff; } @media screen and (max-width: 991px) and (min-width: 768px) { .chairman-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .chairman-box { padding: 0 0 45px; } } .chair-image { width: 100%; height: 295px; display: block; background: #f1eee6; margin: 0 auto; overflow: hidden; position: relative; } .chair-image img { width: 940px; height: 295px; display: block; position: absolute; left: 50%; top: 0; margin-left: -470px; } @media screen and (max-width: 767px) { .chair-image { height: 192px; } .chair-image img { width: 612px; height: 192px; margin-left: -306px; } } .chair-title { width: 100%; display: block; font-size: 1.75em; line-height: 1; color: #005ca2; font-weight: bold; margin: 24px auto; } @media screen and (max-width: 767px) { .chair-title { font-size: 1.375em; margin-bottom: 14px; } } .chair-doc { width: 100%; display: block; font-size: 0.875em; line-height: 2.143em; color: #333333; } .chair-doc img { max-width: 100%; display: block; margin: 0 auto; } @media screen and (max-width: 767px) { .chair-doc { font-size: 1em; line-height: 1.5em; } } .chair-signature { width: 100%; display: block; text-align: right; margin-top: 30px; } .chair-signature img { height: 90px; } @media screen and (max-width: 767px) { .chair-signature { margin-top: 26px; } .chair-signature img { height: 58px; } } /***** 走进佐力-关于佐力 ****/ .about-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 57px; } @media screen and (max-width: 991px) and (min-width: 768px) { .about-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .about-box { padding: 0 0 41px; } } .about-image { width: 100%; display: block; overflow: hidden; } .about-image img { width: 100%; max-width: 100%; display: block; } .about-title { width: 100%; display: block; font-size: 1.625em; line-height: 1; color: #005ca2; margin: 24px auto; overflow: hidden; } @media screen and (max-width: 767px) { .about-title { font-size: 1.25em; margin: 33px auto 18px; } } .about-doc { width: 100%; font-size: 0.875em; line-height: 1.714em; color: #333333; overflow: hidden; } .about-doc img { max-width: 100%; display: block; margin: 0 auto; } @media screen and (max-width: 767px) { .about-doc { font-size: 1em; line-height: 1.5em; } } /******** 走进佐力-组织架构 ********/ .orgnization-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 56px; } .orgnization-box img { max-width: 100%; display: block; margin: 0 auto; } @media screen and (max-width: 991px) and (min-width: 768px) { .orgnization-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .orgnization-box { padding: 0 0 45px; } } /******** 走进佐力-佐力足迹 ********/ .history-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .history-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .history-box { padding: 0 0 45px; } } .history-left { padding: 0; } .history-left .list { width: 100%; background: url(../images/bg_03.png) repeat-y 5px top; overflow: hidden; } .history-left .list li { width: 100%; padding-left: 40px; font-size: 0.875em; line-height: 1.714em; color: #333333; background: url(../images/icon_06.png) no-repeat left 0.714em; margin-bottom: 35px; } @media screen and (max-width: 767px) { .history-left .list li { margin-bottom: 21px; } } .history-left .list .month { color: #666666; margin-right: 10px; } .history-left .list .year { width: 100%; display: block; font-size: 1em; line-height: 30px; color: #005ca2; margin-bottom: 6px; } .history-left .list .year span { font-size: 1.875em; } .btn-more { width: 100%; height: 40px; display: block; background: #005ca2; text-align: center; font-size: 0.875em; line-height: 40px; color: #fff; } .btn-more:hover { color: #fff; } @media screen and (max-width: 767px) { .btn-more { height: 35px; line-height: 35px; } } .history-right { text-align: right; padding: 0; } .history-right img { width: 300px; max-width: 100%; } /****** 走进佐力-企业荣誉 *****/ .honor-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .honor-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .honor-box { padding: 0 0 45px; } } .honor-list { width: 100%; margin: 0 -10px; overflow: hidden; } @media screen and (max-width: 767px) { .honor-list { margin: 0; } } .honor-list li { padding: 0 10px; font-size: 0.875em; line-height: 1.714em; color: #333; text-align: center; overflow: hidden; margin-bottom: 24px; } .honor-list li a { display: block; color: #333; } .honor-list li img { width: 100%; max-width: 100%; display: block; margin: 0 auto; } .honor-list li .title { width: 100%; display: block; margin: 6px auto; } @media screen and (min-width: 992px) { .honor-list{ display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 0 0; } .honor-list li.col-md-4{ width: 100%; } } @media screen and (max-width: 767px) { .honor-list li { margin-bottom: 21px; padding: 0; } } /****** 走进佐力-精善文化-员工文化 *****/ .staff-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .staff-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .staff-box { padding: 0 0 45px; } } .staff-list { width: 100%; margin: 0 -10px 10px; overflow: hidden; } @media screen and (max-width: 767px) { .staff-list { margin: 0; } } .staff-list li { padding: 0 10px; font-size: 0.875em; line-height: 1.714em; color: #333; overflow: hidden; margin-bottom: 24px; } .staff-list li a { display: block; color: #333; } .staff-list li img { width: 100%; max-width: 100%; display: block; margin: 0 auto; } .staff-list li .doc { width: 100%; overflow: hidden; margin: 14px auto 0; } .staff-list li .title { width: 100%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .staff-list li .time { width: 100%; display: block; font-size: 0.857em; color: #666666; } @media screen and (max-width: 767px) { .staff-list li { padding: 0; } } /***** 走进佐力-精善文化-文明创建 *****/ .civilization-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .civilization-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .civilization-box { padding: 0 0 45px; } } .civ-list { width: 100%; margin: 0 auto; overflow: hidden; } .civ-list li { width: 100%; padding: 30px 0; overflow: hidden; border-bottom: solid 2px #e1e1e1; } .civ-list li:hover { background: #f6f6f6; } @media screen and (max-width: 767px) { .civ-list li { padding: 16px 0 13px 6px; border-width: 1px; } } .civ-list a { width: 100%; height: 90px; overflow: hidden; margin: 0 auto; display: block; } .civ-list .time { width: 90px; height: 90px; display: block; background: #f6f6f6; overflow: hidden; float: left; text-align: center; font-family: Arial, Helvetica, sans-serif; } .civ-list .time span { width: 100%; display: block; } .civ-list .data { font-size: 1.5em; line-height: 1; color: #1a5391; margin: 12px auto 9px; } .civ-list .month { font-size: 0.75em; line-height: 1; color: #666666; text-transform: uppercase; } .civ-list .year { font-size: 1em; line-heght: 1; color: #666666; } .civ-list .media-body { padding-left: 30px; } .civ-list .media-heading { width: 100%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1em; line-height: 2.5; color: #333333; } .civ-list .doc { width: 100%; height: 4em; display: block; overflow: hidden; margin-top: 5px; font-size: 0.75em; line-height: 2em; color: #666666; } @media screen and (max-width: 767px) { .civ-list a { height: auto; } .civ-list .media-body { padding: 0; } .civ-list .media-heading { line-height: 1; margin-bottom: 11px; } .civ-list .doc { height: 4.287em; font-size: 0.875em; line-height: 1.429em; margin: 0; } } /******* 走进佐力-文明建设详细页 *******/ .civ-left { padding: 0 20px 500px 0; } .civ-left .civ-top { width: 100%; overflow: hidden; padding-bottom: 20px; border-bottom: solid 1px #dddddd; } .civ-left .civ-top .title { width: 100%; display: block; font-size: 1.25em; line-height: 1.2em; color: #1a5391; font-weight: bold; margin: -0.1em auto 12px; } .civ-left .civ-top .time { width: 100%; display: block; font-size: 0.75em; line-height: 1; color: #999999; } @media screen and (max-width: 767px) { .civ-left .civ-top .time { font-size: 0.875em; } } .civ-left .civ-doc { width: 100%; font-size: 0.875em; line-height: 2em; color: #333333; overflow: hidden; padding: 12px 0 32px; } @media screen and (max-width: 767px) { .civ-left .civ-doc { font-size: 1em; } } .civ-left .civ-doc img { max-width: 100%; display: block; margin: 0 auto; } .btn-return { width: 80px; height: 30px; display: block; background: #005ca2; text-align: center; font-size: 0.875em; line-height: 30px; color: #fff; } .btn-return:hover { color: #fff; } .civ-right { padding: 0; } .civ-right .title { width: 100%; display: block; font-size: 1.25em; line-height: 1; color: #005ca2; margin-bottom: 20px; } .civ-right .title a { color: #005ca2; } .civ-right .image { width: 100%; position: relative; overflow: hidden; display: block; margin-bottom: 10px; } .civ-right .image img { width: 100%; display: block; } .civ-right .image span { width: 80px; height: 20px; display: block; text-align: center; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; font-size: 0.875em; line-height: 20px; color: #fff; background: #1d84da; position: absolute; left: 50%; bottom: 27%; margin-left: -40px; } /******* 媒体中心-企业新闻列表 ******/ .news-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .news-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .news-box { padding: 0 0 45px; } } .news-list { width: 100%; overflow: hidden; margin-bottom: 10px; } .news-list img { width: 100%; display: block; max-width: 100%; } .news-list li { margin-bottom: 30px; } .news-list .title { width: 100%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1em; line-height: 1; color: #333333; margin: 19px auto 2px; } .news-list .time { width: 100%; display: block; font-size: 0.75em; line-height: 1.833em; color: #666666; margin-bottom:5px; } .news-list .txt { width: 100%; height: 3.666em; display: block; overflow: hidden; font-size: 0.75em; line-height: 1.833em; color: #666666; } @media screen and (min-width: 767.98px) { .news-list li.col-md-4,.video-list li.col-md-4{ width: 100%; min-width: 0px; } .news-list .image img{ aspect-ratio: 418 / 278; object-fit: cover; } .news-list,.video-list{ display: grid; grid-template-columns: repeat(3,1fr); } } @media screen and (max-width: 767px) { .news-list .time, .news-list .txt { font-size: 0.875em; } } /****** 媒体中心-视频新闻 *******/ .video-box { width: 100%; height: 530px; margin: 0 auto; overflow: hidden; display: none\9; } @media screen and (min-width: 768px) and (max-width: 991px) { .video-box { height: 340px; } } @media screen and (max-width: 767px) { .video-box { height: 220px; } } .video-js { margin: 0 auto; } .video-js .vjs-big-play-button { width: 100px; height: 100px; border-radius: 100%; -moz-border-radius: 100%; -webkit-border-radius: 100%; left: 50%; top: 50%; margin: -50px 0 0 -50px; border: none; background: none; } .vjs-icon-play:before, .video-js .vjs-big-play-button:before { background: url(../images/btn_03.png) no-repeat center center; content: ""; border: none; } .video-box2 { width: 100%; margin: 0 auto; overflow: hidden; display: none; display: block\9; } .video-box2 .object { width: 100%; height: 530px; margin: 0 auto; display: block; } @media screen and (max-width: 767px) { .video-box2 .object { height: 220px; } } .video-list { width: 100%; overflow: hidden; margin: 20px auto 0; } .video-list li { padding: 0; margin: 0 auto 20px; } .video-list .media { width: 100%; display: block; overflow: hidden; } .video-list .pull-left { width: 42.8%; position: relative; padding: 0; margin-right: 10px; } .video-list .media-object { width: 100%; max-width: 100%; display: block; } .video-list .icon { width: 100%; height: 100%; display: block; background: url(../images/btn_02.png) no-repeat center center; background-size: 30% auto; position: absolute; left: 0; top: 0; } .video-list .media-body { padding-right: 10%; } @media screen and (max-width:767px){ .video-list .media-body { padding-right: 0; } } .video-list .media-heading { width: 100%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.875em; line-height: 1.714em; color: #333; } .video-list .time, .video-list .num { width: 100%; display: block; font-size: 0.75em; line-height: 1.667em; color: #666666; } @media screen and (max-width: 767px) { .video-list .media-heading { font-size: 1.125em; } .video-list .time, .video-list .num { font-size: 0.813em; } } .video-title{ width:100%; display:block; overflow:hidden; padding:10px 0; border-bottom:solid 1px #ddd; margin-bottom:20px; } .video-title .title{ float:left; display:block; font-size:1.25em; line-height:1.333em; color:#333; font-weight:normal; } .video-title .title a{ color:#333; } .video-title .time{ float:right; display:block; font-size:0.875em; line-height:1.714em; color:#666; } /****** 产品中心-列表 ******/ .product-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .product-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .product-box { padding: 0 0 45px; } } .category-name { width: 100%; overflow: hidden; display: block; font-size: 1.25em; line-height: 1; color: #005ca2; } .product-list { width: 100%; display: block; overflow: hidden; margin: 19px 0 0 -30px; } .product-list li { overflow: hidden; padding: 0 11px 30px 30px; } .product-list .media { width: 100%; overflow: hidden; display: table; padding: 13px 0 3px; border-bottom: dotted 1px #dddddd; } .product-list .pull-left { width: 160px; height: 185px; padding-right: 14px; overflow: hidden; line-height: 185px; text-align: center; } .product-list .media-object { height: 65%; display: inline; width: 97%; } .product-list .media-heading { width: 100%; display: block; font-size: 1em; line-height: 1.5em; color: #333333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 34px; } .product-list .doc { width: 100%; height: 6em; display: block; overflow: hidden; font-size: 0.75em; line-height: 2em; color: #666666; margin: 13px 0 11px; } .product-list .more { width: 100%; display: block; text-align: right; font-size: 0.75em; line-height: 2em; color: #999999; } .product-list li:hover .doc, .product-list li:hover .more { color: #1a5391; } @media screen and (max-width: 767px) { .product-list { margin: 0; } .product-list li { padding: 0; } .product-list li:first-child { margin-top: -20px; } .product-list .media { padding: 20px 0; } .product-list .pull-left { width: 120px; height: 120px; line-height: 120px; padding-right: 15px; } .product-list .media-heading { margin: -4px 0 0; } .product-list .doc { height: 7.15em; font-size: 0.875em; line-height: 1.429em; margin: 7px 0 0; } .product-list .more { display: none; } } /***** 产品中心-详细页 *****/ .product-box .btn-return { margin-top: 20px; } .product-detail { width: 100%; overflow: hidden; position: relative; padding: 1.25em 0; padding-top: 0; } .product-detail .pro-left { height: 344px; line-height: 344px; padding: 0 8% 0 0; text-align: center; } .product-detail .pro-left img { width: 100%; max-width: 100%; } .product-detail .pro-right { height:344px; font-size: 0.875em; line-height: 1.714em; color: #333333; overflow: hidden; padding: 0 0 10px; } .product-detail .pro-right .conter{ width:100%; height:100%; overflow:hidden; } .pro-right .mCSB_inside > .mCSB_container{ margin-right:20px; } .pro-right .mCSB_draggerRail{ background:#eee; } .pro-right .mCSB_dragger_bar{ background:#005ca2; } @media screen and (max-width: 414px) { .product-detail .pro-left { height: 175px; line-height: 175px; padding: 0; } .product-detail .pro-left img { width:auto; min-width:0; max-width: 51.3%; max-height:100%; } .product-detail .pro-right { height:auto; } } @media screen and (min-width: 415px) and (max-width: 767px) { .product-detail .pro-left { height: 270px; line-height: 270px; padding: 0; } .product-detail .pro-left img { width:auto; min-width:0; max-width: 51.3%; max-height:100%; } .product-detail .pro-right { height:auto; } } .product-detail .pro-right .name { font-size: 1.286em; line-height: 1.333em; color: #333; display: block; width: 100%; margin: 0 0 11px; } .product-detail .pro-right .list { width: 100%; overflow: hidden; margin-top: 16px; } .product-detail .pro-right .list strong { width: auto; float: left; font-weight: normal; } .product-detail .pro-right .list span { display: table; } @media screen and (max-width: 767px) { .product-detail .pro-right .name { margin: 0 0 11px; } .product-detail .pro-right .list { margin-top: 9px; } .product-detail .pro-right .list span { display: inline; } } .pro-other { width: 100%; overflow: hidden; margin-bottom: 30px; border-top: solid 1px #dddddd; padding-top: 16px; position: relative; } .pro-other .title { width: 100%; display: block; font-size: 0.875em; line-height: 1.429em; color: #1a5391; margin-bottom: 21px; } .pro-other .pro-bd { width: 100%; height: 150px; overflow: hidden; } .pro-other .pro-bd ul { width: 100%; float: left; } .pro-other .pro-bd li { width: 33%; margin: 0; float: left; } .pro-other .pro-bd a { width: 95%; height: 150px; display: block; margin: 0 auto; background: #fff; position: relative; padding-left: 40%; padding-right: 2%; padding-top: 7px; border: 1px solid #dddddd; } .pro-other .pro-bd .image { width: 100%; height: 124px; line-height: 124px; text-align: center; position: absolute; width: 38%; left: 2%; top: 8%; } .pro-other .pro-bd .image img { width: 80%; max-width: 80%; } .pro-other .pro-bd .name { width: 100%; display: block; font-size: 1em; line-height: 1.5em; color: #333333; margin-bottom: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pro-other .pro-bd .doc { width: 100%; height: 8em; display: block; font-size: 0.75em; line-height: 2em; color: #666666; overflow: hidden; } .pro-other .pro-bd .doc strong{ color: #005ca2; } .pro-other .pro-bd .ck { width: 100%; display: block; text-align: right; font-size: 0.75em; line-height: 2em; color: #005ca2; margin-top: 7px; display: none; } .pro-other .pro-btn { width: auto; overflow: hidden; position: absolute; right: 0; top: 15px; } .pro-other .pro-btn a { width: 35px; height: 25px; display: block; float: left; margin-left: 10px; text-align: center; font-size: 0.875em; line-height: 25px; color: #aaaaaa; background: #e1e1e1; font-family: Arial, Helvetica, sans-serif; cursor: pointer; } .pro-other .pro-btn a:hover { background: #1a5391; color: #fff; } /**** 产品中心-常见问题 ****/ .product-box .row { width: 100%; margin: 0 auto; overflow: hidden; } .project-left { padding: 0 20px 0 0; } .project-left .title { width: 100%; display: block; font-size: 1.25em; line-height: 1; color: #005ca2; margin: 0 0 16px; } .faq-list { width: 100%; overflow: hidden; } .faq-list li { width: 100%; overflow: hidden; border-bottom: solid 1px #ededed; } .faq-list .question { width: 100%; display: block; font-size: 0.875em; line-height: 35px; color: #333333; padding: 10px 42px 10px 0; position: relative; cursor: pointer; } .faq-list .but { width: 42px; height: 42px; display: block; font-size: 1.571em; line-height: 42px; color: #005ca2; position: absolute; right: 0; top: 50%; margin-top: -21px; } .faq-list .answer { width: 100%; font-size: 0.75em; line-height: 1.667em; color: #666666; overflow: hidden; padding-bottom: 20px; display: none; } .faq-list .answer .icon { font-size: 1.167em; line-height: 1.429em; float: left; color: #333333; } @media screen and (max-width: 991px) { .faq-list .question { font-size: 1em; } .faq-list .answer { font-size: 0.875em; } } /***** 创新研发 ****/ .research-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .research-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .research-box { padding: 0 0 45px; } } .research-box .row { width: 100%; margin: 0 auto; overflow: hidden; } .research-list .question a { width: 100%; display: block; color: #333; } .research-list .answer a { width: 100%; display: block; color: #666; } /**** 品质监管 ****/ .quality-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .quality-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .quality-box { padding: 0 0 45px; } .quality-box .project-left .title { margin-top: 0; } } .quality-box .row { width: 100%; margin: 0 auto; overflow: hidden; } .quality-box .civ-right { margin: 13px 0 0; } .quality-doc { width: 100%; overflow: hidden; font-size: 0.875em; line-height: 1.714em; color: #333333; padding-top: 5px; } .quality-doc img { width: 100%; max-width: 100%; display: block; margin: 0 auto; } @media screen and (max-width: 767px) { .quality-doc { padding: 0; font-size: 1em; } } /******** 服务与营销-营销分布 *******/ .marketing-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .marketing-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .marketing-box { padding: 0 0 45px; } .marketing-box .project-left .title { margin-top: 0; } } .marketing-doc { width: 100%; overflow: hidden; font-size: 0.875em; line-height: 1.714em; color: #333333; } .marketing-doc img { max-width: 100%; display: block; margin: 70px auto 0; } @media screen and (max-width: 767px) { .marketing-doc { font-size: 1em; } .marketing-doc img { margin-top: 25px; } } /****** 服务与营销-在线问答 ******/ .project-title { width: 100%; display: block; font-size: 1.25em; line-height: 1; color: #005ca2; margin: 0 0 16px; } .online-left { padding: 0 24px 0 0; } .online-left .form-group { width: 100%; margin: 0 auto 10px; overflow: hidden; } .online-left .control-label { padding: 0; font-size: 0.875em; line-height: 30px; color: #333333; font-weight: normal; white-space: nowrap; text-align: right; } .online-left .control-box { padding: 0; } .online-left .form-control { width: 100%; height: 30px; display: block; border: solid 1px #ddd; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; font-size: 0.875em; color: #333; } .online-left textarea.form-control { height: 100px; line-height: 1.714em; } .online-left .code { height: 30px; display: block; padding: 0 0 0 13px; overflow: hidden; text-align: right; } .online-left .code img { height: 100%; max-width: 100%; } .online-left .form-btn { padding-top: 20px; position: relative; } .online-left .form-btn .ts { width: 256px; font-size: 0.75em; line-height: 1.5em; color: #666666; position: absolute; right: 0; bottom: 0; } @media screen and (max-width: 991px) { .online-left { margin-bottom: 32px; padding: 0; } .online-left .form-btn { padding-top: 5px; } } .btn-submit { width: 90px; height: 40px; display: block; text-align: center; font-size: 1em; line-height: 40px; color: #fff; background: #005ca2; } .btn-submit:hover, .btn-submit:focus, .btn-submit:active { color: #fff; } @media screen and (max-width: 991px) { .btn-submit { width: 100%; height: 36px; line-height: 36px; font-size: 1em; } } .online-right { padding: 0 0 0 10px; } @media screen and (max-width: 991px) { .online-right { padding: 0; } } /***** 人力资源-用人理念 *****/ .concept-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .concept-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .concept-box { padding: 0 0 45px; } .concept-box .project-left .title { margin-top: 0; } } .concept-box .image { width: 100%; max-width: 100%; display: block; margin: 0 auto; } .concept-left { padding: 0 15px 0 0; font-size: 0.75em; line-height: 2em; color: #666666; } .concept-left .title { font-size: 1.333em; line-height: 1.5em; color: #333; margin: 11px 0 5px; } @media screen and (max-width: 767px) { .concept-left { font-size: 1em; line-height: 1.5em; margin-bottom: 22px; } .concept-left .title { font-size: 1.125em; line-height: 1.333em; } } .concept-right { padding: 0 0 0 15px; font-size: 0.75em; line-height: 2em; color: #666666; } .concept-right .list { margin-top: 10px; } .concept-right li { width: 100%; display: block; } .concept-right .title { font-size: 1.333em; line-height: 1.5em; color: #333; width: auto; float: left; margin-right: 10px; } .concept-right span { display: table; } @media screen and (max-width: 767px) { .concept-right { font-size: 1em; line-height: 1.5em; margin-bottom: 22px; } .concept-right .title { font-size: 1.125em; line-height: 1.333em; } .concept-right span { display: inline; } } /***** 人力资源-广纳贤士 *****/ .hr-top { width: 100%; overflow: hidden; } .hr-top .title { width: 100px; font-size: 1.25em; line-height: 1; color: #005ca2; padding: 0 18px 19px 0; float: left; } .hr-top .sch-box { padding: 0; float: left; } .hr-top .department { width: 220px; height: 40px; display: block; border: solid 1px #aeaeae; font-size: 0.875em; color: #999; margin-bottom: 10px; padding: 10px; background:url(../images/btn_09.png) no-repeat 95% center / 10px; } .hr-top .sch-group { width: 100%; overflow: hidden; margin-bottom: 10px; position: relative; } .hr-top .sch-group input { width: 170px; height: 40px; display: block; float: left; border: solid 1px #aeaeae; font-size: 0.875em; color: #333; padding: 10px 14px; } .hr-top .sch-group .btn-sch { width: 40px; height: 40px; float: left; background: url(../images/btn_04.png) no-repeat center center #d9d9d9; } .hr-top .ts { width: 100%; display: block; font-size: 0.875em; line-height: 1.714em; color: #333333; padding-top: 6px; } .hr-top .ts span { color: #1a5391; } @media screen and (max-width: 767px) { .hr-top .title { width: 100%; } .hr-top .sch-box { width: 100%; } .hr-top .department { width: 100%; } .hr-top .sch-group input { width: 100%; } .hr-top .sch-group .btn-sch { height: 38px; position: absolute; right: 1px; top: 1px; } .hr-top .ts { padding-top: 2px; font-size: 0.875em; } } .hr-list { width: 100%; overflow: hidden; margin-top: 20px; } .hr-list .head { width: 100%; height: 62px; border-bottom: solid 1px #d5d5d5; padding: 18px 30px 18px 24px; position: relative; } .hr-list .head .position { min-width: 146px; font-size: 1.125em; line-height: 26px; color: #333333; display: inline-block; } .hr-list .head .num { font-size: 0.875em; line-height: 26px; color: #333; } .hr-list .head .caret { width: 26px; height: 26px; display: block; background: url(../images/btn_05.png) no-repeat center center #1a5391; background-size: 50% auto; position: absolute; right: 30px; top: 50%; margin: -13px 0 0 0; padding: 0; border: none; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; } .hr-list .drop-down { width: 100%; padding: 10px 30px 10px 24px; background: #f5f5f5; display: none; } .hr-list .drop-down dl { margin: 0; } .hr-list .drop-down dt, .hr-list .drop-down dd { display: inline; font-weight: normal; font-size: 0.875em; line-height: 2em; color: #666666; } .hr-list li { width: 100%; } .hr-list li.on .head { background: #d9d9d9; } .hr-list li.on .head .caret { background: url(../images/btn_06.png) no-repeat center center #1a5391; } @media screen and (max-width: 767px) { .hr-list .head { height: 40px; padding: 7px 6px; } .hr-list .head .caret { width: 20px; height: 20px; margin-top: -10px; } .hr-list .head .num { display: none; } .hr-list .drop-down { padding: 13px 6px; } .hr-list .drop-down dt, .hr-list .drop-down dd { line-height: 1.571em; } } /******* 投资者关系 ******/ .investor-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 92px; } .investor-box .row { padding-top: 17px; } .investor-box a { padding: 0 2%; display: block; text-align: center; position: relative; } .investor-box img { width: 100%; max-width: 100%; display: block; margin: 0 auto; } .investor-box .title { width: 100%; display: block; background: #f5f5f5; font-size: 1.25em; color: #333333; line-height: 65px; border-bottom: solid 5px #dddddd; } .investor-box a:hover .title { border-bottom-color: #1a5391; color: #1a5391; } @media screen and (max-width: 991px) and (min-width: 768px) { .investor-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .investor-box { padding: 0 0 45px; } .investor-box .row { padding: 0; } .investor-box a { padding: 0; margin-bottom: 12px; } .investor-box .title { border-bottom-width: 3px; font-size: 1em; line-height: 42px; } } /***** 联系我们-法律声明 ****/ .contact-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 60px; } @media screen and (max-width: 991px) and (min-width: 768px) { .contact-box { padding-top: 30px; padding-bottom: 70px; } } @media screen and (max-width: 767px) { .contact-box { padding: 0 0 45px; } .contact-box .project-left .title { margin-top: 0; } } .law-doc { width: 100%; overflow: hidden; font-size: 0.875em; line-height: 1.714em; color: #333333; padding-top: 4px; } .law-doc img { max-width: 100%; display: block; margin: 0 auto; } @media screen and (max-width: 767px) { .law-doc { padding: 0; font-size: 0.938em; } } /***** 联系我们-联系方式 *****/ .contact-map { width: 100%; height: 300px; display: block; overflow: hidden; position: relative; text-align: center; } .contact-map img { height: 100%; } @media screen and (max-width: 991px) and (min-width: 640px) { .contact-map { height: 323px; } } @media screen and (max-width: 639px) { .contact-map { height: 210px; } } .contact-doc { width: 100%; overflow: hidden; font-size: 0.875em; line-height: 1.714em; color: #444444; } .contact-doc a { color: #444; } .contact-doc dl { margin-bottom: 18px; } .contact-doc dt { font-size: 1.143em; margin: 22px 0 14px; } @media screen and (max-width: 767px) { .contact-doc { font-size: 0.938em; } .contact-doc dt { margin: 16px 0 7px; } } /***** 联系我们-友情链接 *****/ .link-list { width: 100%; overflow: hidden; } .link-list li { padding: 0 1.5%; margin-bottom: 30px; } .link-list li:hover a { box-shadow: 0 0 5px #d8d7d7; -moz-box-shadow: 0 0 5px #d8d7d7; -webkit-box-shadow: 0 0 5px #d8d7d7; } .link-list a { width: 100%; height: 170px; display: block; line-height: 170px; border: solid 1px #dddddd; text-align: center; vertical-align: middle; } .link-list img { max-width: 85%; } @media screen and (max-width: 767px) and (min-width: 640px) { .link-list li { margin-bottom: 20px; } .link-list a { height: 345px; line-height: 345px; } } @media screen and (max-width: 639px) { .link-list li { margin-bottom: 12px; } .link-list a { height: 224px; line-height: 224px; } } /******* 联系我们-子公司 ******/ .company-list { width: 100%; overflow: hidden; margin: 0 auto; } .company-list li { padding: 0 2%; margin-bottom: 20px; } .company-list a { width: 100%; /*height:400px;*/ display: block; background: #f5f5f5; overflow: hidden; } .company-list img { width: 100%; display: block; } .company-list .bot { width: 100%; height: 130px; display: block; overflow: hidden; padding: 0 20px; } .company-list .name { width: 100%; display: block; font-weight: bold; font-size: 1.125em; line-height: 1.222em; color: #333333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 14px 0 9px; } .company-list .doc { width: 100%; height: 4.713em; display: block; overflow: hidden; font-size: 0.875em; line-height: 1.571em; color: #666666; } @media screen and (max-width: 767px) { .company-list li { margin-bottom: 12px; } .company-list .bot { height: 122px; padding: 0 4px; } .company-list .name { font-size: 1em; margin-bottom: 4px; } } /* esg */ .esg-box { width: 100%; overflow: hidden; margin: 0 auto; padding: 0 30px 100px; margin: 40px 0 0; } .esg-box .s-heading-h2{ font-size: 1.25rem; line-height: 1.36em; color: #005CA2; margin-bottom: 2rem; } .esg-list{ width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 30px 40px; } .esg-list .item{ padding: 0 0 40px; border-bottom: solid 1px #DAE4EB; } .esg-list .item-box{ width: 100%; display: grid; grid-template-columns: 150px 1fr; grid-gap: 0 20px; } .esg-list .imgs{ width: 100%; position: relative; padding: 140% 0 0; overflow: hidden; border-radius: 10px; } .esg-list .imgs img{ width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; position: absolute; left: 0; top: 0; border-radius: inherit; } .esg-list .item-body{ display: flex; flex-direction: column; justify-content: space-between; padding: 10px 0 20px; } .esg-list .item-title{ font-size: 1rem; line-height: 1.3em; margin-bottom: 1em; } .esg-list .item-date{ font-size: max(14px, 0.8rem); line-height: 1.25em; color: #999999; } .esg-list .item-handle{ display: flex; margin: 1em 0 0; } .esg-list .btn-download{ height: 2.25em; border-radius: 1.3em; background: #B5CCDE; position: relative; -webkit-transition: all .3s ease; transition: all .3s ease; font-size: max(14px, 0.8rem); line-height: 1.5em; color: #005CA2; cursor: pointer; } .esg-list .btn-download > *{ width: 100%; height: 100%; display: flex; align-items: center; padding: 0 1.5em; color: inherit; font-size: 1em; line-height: inherit; grid-gap: 0 6px; -webkit-transition: none; transition: none; } .esg-list .btn-download .bi{ width: 1.125em; height: 1.125em; display: block; flex: none; -webkit-mask: url('/images/ico-download-black.svg') no-repeat center / contain; mask: url('/images/ico-download-black.svg') no-repeat center / contain; background: currentcolor; position: relative; } @media (min-width: 992px) { .esg-list .item:hover .item-title{ color: #005CA2; } .esg-list .btn-download:hover{ background: #005CA2; color: #fff; } } @media (max-width: 991.98px) { .esg-box{ padding: 0.8rem 0 1.2rem; margin: 0; } .esg-box .s-heading-h2{ font-size: 0.36rem; margin-bottom: 0.48rem; } .esg-list{ grid-template-columns: repeat(1, 1fr); grid-gap: 0.5rem 0; } .esg-list .item{ padding: 0 0 0.5rem; } .esg-list .item-box{ grid-template-columns: 2.35rem 1fr; grid-gap: 0 0.3rem; } .esg-list .imgs{ border-radius: 0.1rem; } .esg-list .item-body{ padding: 0.1rem 0 0; } .esg-list .item-title{ font-size: 0.32rem; line-height: 0.46rem; margin-bottom: 0.12rem; } .esg-list .item-date{ font-size: 0.26rem; line-height: 0.34rem; } .esg-list .item-handle{ margin: 0.3rem 0 0; } .esg-list .btn-download{ height: 0.6rem; border-radius: 0.3rem; font-size: 0.28rem; line-height: 1em; } .esg-list .btn-download > *{ padding: 0 0.33rem; grid-gap: 0 0.1rem; } .esg-list .btn-download .bi{ width: 0.28rem; height: 0.28rem; } .esg-list .item:last-child{ padding: 0; border-bottom: none; } }