html,body{margin: 0;padding: 0;} .pagebox{position:relative;width:1200px; margin:0px auto; }#c_product_list-15452949684154031 > div.kxcp > a:nth-child(1) > div{margin-left:290px !important;} body{ overflow-x: hidden;} .e_IndexMajorStyleBox-001 .stylebox_top{background-color: rgb(1, 108, 170) !important; height:60px !important;} .e_IndexMajorStyleBox-001 .stylebox_title{background-color: rgb(1, 108, 170) !important;} .e_IndexMajorStyleBox-001 .title_main{line-height:60px !important; font-size:20px !important;} .about-history { height: 608px; padding: 20px 55px 0 !important; background: url(/img/map_bg.jpg?tenantId=123937&viewType=1&v=000); -webkit-background-size: 100% 100%; background-size: 100% 100%; } .about-title { margin-bottom: 25px; } .about-title h3 { margin: 0 0 10px; font-size: 34px; font-weight: 400; color: #2c2c2c; } .about-title p { margin: 0; font-size: 36px; font-weight: 300; color: #ECECEC; } .title-white h3 { color: #d6d6d6; } .title-white p { color: rgba(222,222,222,.09); } .about-history-list { position: relative; } .about-history-list .flex-viewport { padding: 0 33px; } .about-history-list .flex-viewport:before { position: absolute; top: 50%; right: 0; left: 0; border-top: 1px solid #C7C7C7; content: ''; } .about-history-list .slides li { position: relative; width: 253px; height: 470px; margin-right: 31px; } .about-history-list .slides li .item { position: absolute; right: -32px; bottom: 0; left: -32px; min-height: 152px; padding: 44px 0 0 0; background-color: #fff; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; -ms-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .about-history-list .slides li .item:before { position: absolute; top: -49px; left: 50%; width: 20px; height: 20px; overflow: hidden; margin-left: -10px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: rgba(140, 140, 140, 0.6); content: ''; } .about-history-list .slides li .item:after { position: absolute; top: -45px; left: 50%; width: 12px; height: 12px; overflow: hidden; margin-left: -6px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #000000; content: ''; } .about-history-list .slides li:nth-child(even) .item { top: 0; bottom: auto; padding: 0 0 44px; } .about-history-list .slides li:nth-child(even) .item:before { top: auto; bottom: -49px; } .about-history-list .slides li:nth-child(even) .item:after { top: auto; bottom: -45px; } .about-history-list .slides li .item:hover { background-color: #bbbbbb; } .about-history-list .slides li .item h3 { position: absolute; top: 0; right: 0; left: 0; height: 44px; line-height: 44px; margin: 0; font-size: 20px; font-weight: 400; color: #000000; text-align: center; background-color: #e2e2e2; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; -ms-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .about-history-list .slides li .item:hover h3 { color: #232323; background-color: #fff; } .about-history-list .slides li .item h3:before { position: absolute; bottom: 100%; left: 50%; margin-left: -9px; border-width: 0 9px 18px; border-style: solid; border-color: transparent transparent #E2E2E2; content: ''; } .about-history-list .slides li:nth-child(even) .item h3 { top: auto; bottom: 0; } .about-history-list .slides li:nth-child(even) .item h3:before { top: 100%; bottom: auto; border-width: 18px 9px 0; border-color: #E2E2E2 transparent transparent; } .about-history-list .slides li .item .desc { line-height: 20px; padding: 22px 26px 0; font-size: 13px; color: #000000; overflow: scroll; height: 152px; overflow-x: hidden; border: 1px solid#f1f1f1; } .about-history-list .slides li .item:hover .desc { color: #ffffff; } .about-history-list .slides li .item .desc p { margin: 0; } .about-history-list .flex-direction-nav { padding: 0; margin: 0; list-style: none !important; } .about-history-list .flex-direction-nav a { position: absolute; top: 50%; width: 48px; height: 160px; line-height: 160px; overflow: hidden; margin-top: -80px; font-size: 50px; font-family: simsun; color: #000000; text-align: center; } .about-history-list .flex-direction-nav a.flex-prev { left: -48px; } .about-history-list .flex-direction-nav a.flex-next { right: -48px; } .about-history-swiper { width: 100%; } .about-history-swiper .swiper-slide .item { overflow: hidden; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background-color: #fff; } .about-history-swiper .swiper-slide .item h3 { margin: 0; height: 40px; line-height: 40px; overflow: hidden; font-size: 20px; text-align: center; color: #999999; background-color: #e2e2e2; } .about-history-swiper .swiper-slide .item .desc { line-height: 20px; padding: 10px; font-size: 14px; color: #929292; } .about-history-swiper .swiper-slide .item .desc p { margin: 0; } .about-history-swiper .about-history-pagination { position: static; margin-top: 10px; } .about-history-swiper .about-history-pagination .swiper-pagination-bullet { background: #fff; } .about-history-swiper .about-history-pagination .swiper-pagination-bullet-active { background: #C91523; } #c_product_list-1545300317287 li{width:380px !important; height:350px !important;} #c_product_list-1545300317287 li figure{width:380px !important; height:300px !important} .e_ContentMajorStyleBox-001 .stylebox_content{border:none !important;} .e_ContentMajorStyleBox-001 .stylebox_title{ background-color: rgb(1, 108, 170) !important;} .e_ContentMajorStyleBox-001 .stylebox_top{background:none !important; border-bottom:1px solid#f1f1f1;} .e_ContentMajorStyleBox-001 .stylebox_bottom_line{background:none !important;} .e_ContentMajorStyleBox-001 .stylebox_top_line{background:none !important;} #c_product_list-15453019990253475 li figure{width:280px !important;} #w_common_text-1545298380305 > div > p > span > span{font-family:Impact !important;} .js-reset_style p{font-size:15px; color:#333; line-height:32px;} .js-reset_style div{font-size:15px; color:#333; line-height:32px;} .js-reset_style span{font-size:15px; color:#333; line-height:32px;} /翻页/ .pre:active{background-color:#da281c !important;} .pre:hover{background-color:#da281c !important;} .pageNum.active{background-color:#da281c !important;} .p.pageNum:active{background-color:#da281c !important; color:#fff !important;} .pageNum:hover{background-color:#da281c !important;} .next{background-color: rgba(242, 242, 242, 1) !important; } .next:active{background-color:#da281c !important;} .next:hover{background-color:#da281c !important;} .e_pagebox { width: auto; height: auto; clear: both; position: relative } .p_page{ float: right; right: 30px; } .p_page .PageInterval { display: inline-block; position: static; float: left; margin-right: 5px; line-height: 38px; font-size: 12px } .p_page .p_PageInterval { display: inline-block; position: static; float: left; margin-right: 5px; line-height: 38px; font-size: 12px } .p_page .pre:after { content: ""; display: none; position: absolute; top: 5px; left: -14px; width: 27px; height: 27px; background-color: rgba(242, 242, 242, 1); font-size: 0; line-height: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: -1 } .p_page .pre:hover:after { top: 4px; left: -12px; background-color: rgba(101, 190, 186, 1); border-radius: 4px 0 0 0; -webkit-box-shadow: 0 3px 0 rgba(90, 90, 90, .8); -moz-box-shadow: 0 3px 0 rgba(90, 90, 90, .8); box-shadow: 0 3px 0 rgba(90, 90, 90, .8); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: -1 } .p_page .pre:active:after { top: 8px; left: -12px; width: 28px; height: 25px; background-color: rgba(90, 170, 167, 1); border-radius: 0 3px 0 0; -webkit-box-shadow: 0 3px 0 rgba(90, 90, 90, .8); -moz-box-shadow: 0 3px 0 rgba(90, 90, 90, .8); box-shadow: 0 3px 0 rgba(90, 90, 90, .8); -webkit-transform: rotate(-226deg); -moz-transform: rotate(-226deg); -o-transform: rotate(-226deg); -ms-transform: rotate(-226deg); transform: rotate(-226deg); z-index: -1 } .p_page .pre { display: inline-table; position: relative; left: 0; top: 0; float: left; height: 30px; margin:0 5px 0 18px; color: rgba(102, 102, 102, 1); border-width: 0; border-style: solid; border-color: rgba(255, 255, 255, 0); background-color: rgba(242, 242, 242, 1); text-align: center; padding-top: 0; padding-right: 20px; padding-left: 20px; } .p_page .pre:hover { color: rgba(255, 255, 255, 1); border-width: 0; border-style: solid; border-color: rgba(255, 255, 255, 0); background-color: rgba(101, 190, 186, 1); cursor: pointer } .p_page .pre:active { background-color: rgba(90, 170, 167, 1) } .p_page .pre .font { display: table-cell; vertical-align: middle; bottom: 0; font-size: 12px } .p_page .pre:hover .iconfont { color: rgba(255, 255, 255, 1) } .p_page .pre:active .iconfont { color: rgba(255, 255, 255, 1) } .p_page .pre .iconfont:before { content: ""; margin-right: 5px } .p_page .next:after { content: ""; display: none; position: absolute; top: 5px; right: -14px; width: 27px; height: 27px; background-color: rgba(101, 190, 186, 1); font-size: 0; line-height: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: -1 } .p_page .next:hover:after { top: 5px; right: -12px; background-color: rgba(101, 190, 186, 1); border-radius: 4px 0 0 0; -webkit-box-shadow: 0 3px 0 #777; -moz-box-shadow: 0 3px 0 #777; box-shadow: 0 3px 0 #777; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); z-index: -1; width: 26px; height: 26px } .p_page .next:active:after { top: 8px; right: -12px; width: 27px; height: 24px; background-color: rgba(90, 170, 167, 1); border-radius: 0 3px 0 0; -webkit-box-shadow: 0 3px 0 #777; -moz-box-shadow: 0 3px 0 #777; box-shadow: 0 3px 0 #777; -webkit-transform: rotate(226deg); -moz-transform: rotate(226deg); -o-transform: rotate(226deg); -ms-transform: rotate(226deg); transform: rotate(226deg); z-index: -1 } .p_page .next { display: inline-table; position: relative; left: 0; top: 0; float: left; height: 30px; color: rgba(255, 255, 255, 1); border-width: 0; border-style: solid; border-color: rgba(255, 255, 255, 0); background-color: rgba(101, 190, 186, 1); text-align: center; padding-top: 0; padding-right: 20px; padding-left: 20px; } .p_page .next:hover { color: rgba(255, 255, 255, 1); border-width: 0; border-style: solid; border-color: rgba(255, 255, 255, 0); background-color: rgba(101, 190, 186, 1); cursor: pointer } .p_page .next:active { background-color: rgba(90, 170, 167, 1) } .p_page .next .font { display: table-cell; vertical-align: middle; bottom: 0; font-size: 12px } .p_page .next:hover .iconfont { color: rgba(255, 255, 255, 1) } .p_page .next:active .iconfont { color: rgba(255, 255, 255, 1) } .p_page .next .iconfont:before { content: ""; margin-top: 3px; float: right; margin-left: 5px } .p_page .pageNum { position: relative; float: left; height: 30px; width: 30px; margin:0 5px 0 0; background-size: 100% 100%; color: rgba(102, 102, 102, 1); border:0 solid rgba(255, 255, 255, 0); cursor: pointer; line-height: 30px; display: table; font-family: inherit; font-size: 14px; font-weight: inherit; text-decoration: none; background-color: rgba(242, 242, 242, 1); text-align: center; } .p_page .pageNum:hover { color: rgba(255, 255, 255, 1); border-width: 0; border-style: solid; border-color: rgba(255, 255, 255, 0); cursor: pointer; text-decoration: none; background-color: rgba(101, 190, 186, 1) } .p_page .pageNum:active { text-decoration: none; background-color: rgba(90, 170, 167, 1) } .p_page .pageNum.active { text-decoration: none; background-color: rgba(90, 170, 167, 1); color: rgba(255, 255, 255, 1) } .p_page .pageNum .font { display: table-cell; vertical-align: middle; bottom: 0 } .p_page .pageNum .iconfont { display: inline; color: rgba(255, 255, 255, 1); vertical-align: middle } .p_page .pageNum:hover .iconfont { color: rgba(255, 255, 255, 1) } .p_page .pageNum:active .iconfont { color: rgba(255, 255, 255, 1) } .p_page .pageNum .iconfont:before { content: "" } .p_page .PageInterval { line-height: 30px; cursor: text; color: rgba(102, 102, 102, 1) } .p_page .p_PageInterval { line-height: 30px; cursor: text; color: rgba(102, 102, 102, 1) } .p_OccupyBox { margin: 0; width: auto; height: auto; padding: 0; border: none; overflow: hidden } .p_CommonInteraction{ margin:0; width: 236px; height:317px; padding:0; border-width:1px; border-style: none; border-color:rgba(228,228,228,0); background-color:transparent; overflow: hidden; } .p_CommonLanternBox{ position: relative; margin:0; width: auto; height:auto; padding:0; border-width:1px; border-style: none; border-color:rgba(228,228,228,0); background-color:transparent; overflow: hidden; } .p_CommonSwitchBtnA{ position: absolute; top: 50%; left: 50%; display:inline-block; vertical-align:middle; cursor:pointer; font-size: 45px; color: #e5e5e5; transform: translate(-50%,-50%); } .p_CommonSwitchBtnA .iconfont:before{ content: "\e687"; display: inline-block; } .p_CommonSwitchBtnA:hover{ cursor:pointer; color:rgba(105,192,188,1); } .p_CommonSwitchBtnB{ position: absolute; top: 50%; right: 50%; display: inline-block; vertical-align: middle; cursor: pointer; transform: translate(50%,-50%); font-size: 45px; color: #e5e5e5; vertical-align: middle; cursor: pointer; } .p_CommonSwitchBtnB .iconfont:before{ content: "\e6ae"; display: inline-block; } .p_CommonSwitchBtnB:hover { color: rgba(105, 192, 188, 1); cursor: pointer } .d_CommonInteractionA{ left: 0; width: 60px; height: auto; vertical-align: middle; position: absolute; overflow: visible; top: 50%; transform: translate(0,-50%); } .d_CommonInteractionB{ right: 0; width: 60px; height: auto; vertical-align: middle; position: absolute; overflow: visible; top: 50%; transform: translate(0,-50%); } .p_CommonSummaryBoxA { margin: 0 0 20px; width: auto; height: auto; padding: 0; border-width: 1px; border-style: none; border-color: rgba(228, 228, 228, 0); background-color: transparent; overflow: hidden; text-align:center; } .p_CommonThumbnailBox { margin: 0; width: auto; height: auto; padding: 0; border-width: 1px; border-style: none; border-color: rgba(228, 228, 228, 0); background-color: transparent; overflow: hidden } .p_CommonSquareNumBtn { display: inline-block; height: 10px; width: 100px; margin: 0 8px; padding: 0; background-color: rgba(228, 228, 228, 1); border-width: 1px; border-color: transparent; color: rgba(153, 153, 153, 1); font-size: 12px; font-family: "Microsoft YaHei"; text-align: center; cursor: pointer } .p_CommonSquareNumBtn img { display: none } .p_CommonSquareNumBtn .shape { text-indent: -9999em; width: inherit; height: inherit; vertical-align: middle } .p_CommonSquareNumBtn.active, .p_CommonSquareNumBtn:hover { background-color: rgba(103, 184, 180, 1); color: rgba(255, 255, 255, 1) } .p_CommonSquareNumBtn.j-nav-active { background-color: rgba(103, 184, 180, 1); color: rgba(255, 255, 255, 1) } .p_scroll { width: 100%; height: auto; position: relative } .p_scroll .vline { width: 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #F0F0F0; opacity: 1; position: absolute; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%) } .p_scroll .scrolling { width: 77px; height: 25px; border: 1px solid #BABABB; background: -webkit-linear-gradient(#fff, #F2F2F3); background: -o-linear-gradient(#fff, #F2F2F3); background: -moz-linear-gradient(#fff, #F2F2F3); background: linear-gradient(#fff, #F2F2F3); border-radius: 6px; position: relative; left: 50%; text-align: center; font-size: 15px; box-shadow: 0 0 10px #fff inset, 0 1px 1px rgba(0, 0, 0, .1); color: #AAA; cursor: pointer } .p_scroll .scrolling:hover { border: 1px solid #BABABB; background: -webkit-linear-gradient(#fff, #F7F7F8); background: -o-linear-gradient(#fff, #F7F7F8); background: -moz-linear-gradient(#fff, #F7F7F8); background: linear-gradient(#fff, #F7F7F8) } .p_scroll .scrolling:active { border: 1px solid #BABABB; background: -webkit-linear-gradient(#fff, #E4E4E4); background: -o-linear-gradient(#fff, #E4E4E4); background: -moz-linear-gradient(#fff, #E4E4E4); background: linear-gradient(#fff, #E4E4E4); box-shadow: 0 0 10px #fff inset, 0 1px 2px rgba(0, 0, 0, .1) } .p_more { position: static; width: 100%; margin: 0 auto; text-align: center; padding-right: 20px; padding-left: 20px; height: 70px; background-color: #F6F7F8; position: relative; border-radius: 0; border-width: 0; color: rgba(115, 115, 131, 1); font-size: 18px } .p_more:active { background-color: #F6F7F8 } .p_more .font { vertical-align: middle; text-align: inherit; line-height: 70px; } .p_more .iconfont { display: inline; vertical-align: middle; font-style: normal } .p_more .iconfont:before { content: "\e6d1" }