@charset "utf-8"; /* * Project Name:金沙集团1862cc集团 * Author:位置 * Date:2017-1-17 */ @font-face { font-family: 'helvetica_neue_ltregular'; src: url('helveticaneuelt-mediumcond-webfont.woff2') format('woff2'), url('helveticaneuelt-mediumcond-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'humanst521_btregular'; src: url('humanst521_bt-webfont.woff2') format('woff2'), url('humanst521_bt-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: "Bourbon-Grotesque-Regular-2"; src: url("Bourbon-Grotesque-Regular-2.woff2") format("woff2"), url("Bourbon-Grotesque-Regular-2.woff") format("woff"), url("Bourbon-Grotesque-Regular-2.ttf") format("truetype"), url("Bourbon-Grotesque-Regular-2.eot") format("embedded-opentype"), url("Bourbon-Grotesque-Regular-2.svg") format("svg"); } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0px; border: 0; font-size: 100%; outline: none; } html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-x: hidden; } /* always display scrollbars */ body { font: 12px/1.8 "Noto Sans SC","Microsoft YaHei New","Microsoft Yahei","微软雅黑","Hiragino Sans GB","冬青黑体","Arial","Helvetica","SimHei","黑体","STXihei","华文细黑",sans-serif; margin: 0 auto; color: #989898; _background-attachment: fixed; _background-image: url(about:blank); width: 100%; height: 100%; overflow: hidden; /*background: #e1e1e1;*/ } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } input, select { vertical-align: middle; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } strong { font-weight: bold; } input { outline: none; padding: 0; } img { border: 0; } input[type="text"], input[type="button"], input[type="submit"], input[type="reset"], select { -webkit-appearance: none; border-radius: 0; } textarea { -webkit-appearance: none; border-radius: 0; background: none; outline: none; padding: 0; margin: 0; border: none; } ::-moz-selection { background: #f7a300; color: #fff; text-shadow: none; } ::selection { background: #f7a300; color: #fff; text-shadow: none; } a { text-decoration: none; blr: expression(this.onFocus=this.blur()); cursor: pointer; -webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } a:link, a:visited { text-decoration: none; } a:active, a:hover { text-decoration: none; } .clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } .fc { text-align: center; } .fr { text-align: right; } .l { float: left; display: inline-block; } .r { float: right; display: inline-block; } .vt { vertical-align: top; } .vm { vertical-align: middle; } .inner { width: 1280px; margin: 0px auto; } .wraggle { width: 1600px; margin: auto; margin-bottom: 100px; position: relative; } .mtop { height: 136px; background: #fff; } .headers{ width: 100%; position: fixed; left: 0; top: 0; z-index: 99; transition: 0.34s; padding: 40px 0;} .headers.scollfox{ background-color: #fff; padding: 10px 0; box-shadow: 0 0 5px rgba(0,0,0,0.4);} .headers.innerhead{ background-color: #fff; padding-bottom: 0;} .headers.scollfox .navs-li >li >a{ color: #4d4d4d;} .headers.scollfox .navs-li >li:hover >a,.headers.innerhead .navs-li >li.active >a{ color: #4d4d4d;} .headers.scollfox .navs-li >li:hover >a:before,.headers.scollfox .navs-li >li.active >a:before{ background: #e3811a;} .headers.innerhead .navs-li >li:hover >a:before,.headers.innerhead .navs-li >li.active >a:before{ background: #e3811a;} .headers.scollfox .navs-li >li >a,.headers.innerhead .navs-li >li >a{ color: #4d4d4d;} .headers.scollfox .navs-li >li:hover >a,.headers.innerhead .navs-li >li.active >a{ color: #e3811a;} .header-logo{ display: block; width: 329px; height: auto; float: left;} .header-logo img{ display: block; width: 100%; height: auto;} .navs-li{ float: right; margin-top: 19px; margin-right: 96px;} .navs-li >li{ position: relative; float: left; padding-left: 84px; padding-left: 4.375vw;} .navs-li >li:first-child{ padding-left: 0;} .navs-li >li >a{ position: relative; display: block; line-height: 1.1; color: #e3811a; font-size: 20px; padding-bottom: 10px;} .navs-li >li >a:before{ content: ""; width: 0; height: 2px; background-color: #fff; position: absolute; right: 0; bottom: 0; transition: 0.4s;} .navs-li >li:hover >a,.navs-li >li.active >a{ color: #fff;} .navs-li >li:hover >a:before,.navs-li >li.active >a:before{ width: 100%; right: auto; left: 0;} .navs-li >li:hover .navs-down{ opacity: 1; visibility: visible; transform: translateY(0px);} .navs-down{ opacity: 0; visibility: hidden; transform: translateY(40px); transition: 0.5s; position: absolute; left: 84px; left: 4.375vw; top: 100%; width: 800px; padding-top: 17px; } .navs-down-list:before{ content: ""; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 6px solid #e3811a; position: absolute; left: 33px; top: -6px;} .navs-down-list{ white-space: nowrap; display: inline-block; position: relative; padding-left: 25px; padding-right: 30px; background: #e3811a;} .navs-down-list li{ float: left; position: relative; padding: 0 25px;} .navs-down-list li:before{ content: ""; width: 2px; height: 14px; background-color: #fff; position: absolute; left: 0; top: 50%; margin-top: -7px;} .navs-down-list li a{ position: relative; display: block; line-height: 43px; height: 43px; color: #fff; font-size: 16px;} .navs-down-list li a:before{ content: ""; width: 0; height: 2px; background: #fff; position: absolute; right: 0; bottom: 6px; transition: 0.4s;} .navs-down-list li a:hover:before{ width: 100%; right: auto; left: 0;} .navs-down-list li:first-child:before{ display: none;} .banners{ position: relative; z-index: 2;} .banner-item{ float: left; width: 100%; opacity: 1 !important;} .banner-item figure{ display: block; line-height: 1; overflow: hidden;} .banner-item figure img{ display: block; width: 100%; height: auto; position: relative; transform-origin:right 0; position:absolute; right:0; top:0; position:relative;} .banner-item.out{ opacity:1; z-index:3 !important; -webkit-animation: slideOutBottom 0.7s forwards ease-in-out; animation: slideOutBottom 0.7s forwards ease-in-out;} .banner-item.in{ opacity:1; z-index:2 !important; -webkit-animation: slideInHalfFromTop 0.7s forwards ease-in-out; animation: slideInHalfFromTop 0.7s forwards ease-in-out;} .banner-data{ width: 42.7%; height: 100%; position: absolute; left: 0; top: 0; z-index: 10; background: url(../images/databg.png) right top no-repeat; background-size: cover;} .data-tops{ position: absolute; left: 10.48%; top: 22%;} .dataa-infos{ font-size: 0; line-height: 1; margin-bottom: 42px;} .dataa-infos b{ display: inline-block; color: #fff; font-size: 5.5208vw; font-family: "Bourbon-Grotesque-Regular-2"; font-weight: normal;} .dataa-infos p{ display: inline-block; margin-left: 6px; color: #fff; font-size: 23px; padding-left: 8px; border-left: 1px solid #fff;} .data-arrow{ display: block; margin-left: 13px; width: 18px; height: 40px; background: url(../images/arrow16.png) center no-repeat; line-height: 1;} .datat-search{ width: 40.48%; position: absolute; right: 47.3%; bottom: 110px;} .data-search-text{ height: 44px; position: relative; padding-left: 14px;} .data-search-text:before{ content: ""; width: 14px; height: 44px; background: url(../images/serach-a.png) center no-repeat; position: absolute; left: 0; top: 0;} .data-search-text .text{ width: 90%; box-sizing: border-box; position: absolute; left: 14px; right: 46px; top: 0; padding-left: 10px; height: 44px; line-height: 44px; color: #fff; font-size: 18px; border: none; border-top: 2px solid #fff; border-bottom: 2px solid #fff; background: none; outline: none;} .data-search-text .text::-webkit-input-placeholder{ color: rgba(255,255,255,0.6);} .data-search-text .text:focus::-webkit-input-placeholder{ opacity: 0; visibility: hidden;} .data-search-text .sub{ padding: 0; margin: 0; border: none; width: 68px; height: 44px; background: url(../images/search-btn.png) center no-repeat; position: absolute; right: 0; top: 0; cursor: pointer;} .datat-search p{ color: #fff; font-size: 15px; margin-top: 10px; margin-left: 4px;} .banner-swiper{ position: relative; z-index: 1;} .banner-swiper .slick-list{ position: relative; z-index: 0;} .banner-swiper .slick-dots{ position: absolute; right: 4.6875vw; bottom: 126px; z-index: 10; height: 17px; line-height: 0;} .banner-swiper .slick-dots li{ float: left; margin-left: 16px;} .banner-swiper .slick-dots li:first-child{ margin-left: 0;} .banner-swiper .slick-dots li button{ padding: 0; margin: 0; border: none; width: 19px; height: 17px; background: url(../images/hexagon.png) center no-repeat; cursor: pointer; outline: none; text-indent: 9999px; overflow: hidden;} .banner-swiper .slick-dots li.slick-active button{ background: url(../images/hexagon1.png) center no-repeat;} .banner-data.article-block{ left: -42.7%; transition: 0.8s;} .banner-data.articleShow{ left: 0;} .data-tops.article-block .dataa-infos,.datat-search.article-block,.data-tops.article-block .data-arrow,.banner-data.article-block .datat-search{ opacity: 0; visibility: hidden; transform: translateX(-100px); transition: 0.65s 0.3s;} .data-tops.articleShow .dataa-infos,.datat-search.articleShow,.data-tops.articleShow .data-arrow,.banner-data.articleShow .datat-search{ opacity: 1; visibility: visible; transform: translateX(0);} .data-tops.article-block .dataa-infos:nth-child(2),.data-tops.article-block .data-arrow{ transition-delay: 0.6s;} .data-tops.article-block .dataa-infos:nth-child(3){ transition-delay: 0.9s;} .banner-data.article-block .datat-search{ transition-delay: 1.2s;} @-webkit-keyframes slideOutBottom { from {} to { -webkit-transform: translateX(-100%); } } @keyframes slideOutBottom { from {} to { -webkit-transform: translateX(-100%); transform: translateX(-100%); } } @-webkit-keyframes slideInHalfFromTop { from { -webkit-transform: translateX(50%); } to { -webkit-transform: translateX(0); } } @keyframes slideInHalfFromTop { from { -webkit-transform: translateX(50%); transform: translateX(50%); } to { -webkit-transform: translateX(0); transform: translateX(0); } } .slick-list { overflow: hidden; width: 100%; height: 100%; } .slick-track { position: relative; left: 0; top: 0; display: block; zoom: 1; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both;} .industrial{ padding-top: 78px;} .common-titles{ margin-bottom: 62px; text-align: center;} .common-titles small{ display: block; text-align: center; line-height: 1; color: #e6e6e6; font-size: 59px; font-size: 2.0729vw; font-family: "Bourbon-Grotesque-Regular-2";} .common-titles strong{ display: block; line-height: 1; color: #4d4d4d; font-size: 30px; margin-top: -20px; letter-spacing: 6px; font-weight: normal;} .distribute-item{ position: relative; width: 33.3333%; float: left;} .distributor-top{ position: relative; padding-bottom: 53.43%; background-color: #f4f4f4;} .distributor-wrap{ width: 100%; position: absolute; left: 0; top: 50%; margin-top: -76px; text-align: center;} .distributor-wrap img{ display: block; height: 80px; margin: auto; transition: 0.4s;} .distributor-wrap small{ display: block; text-align: center; color: #e3811a; font-size: 20px; font-family: "Bourbon-Grotesque-Regular-2"; margin-top: 18px; line-height: 1; margin-bottom: 12px; text-transform: uppercase;} .distributor-wrap span{ display: block; line-height: 1; color: #e3811a; font-size: 22px;} .distribute-item figure{ display: block; line-height: 1; padding-bottom: 53.43%; overflow: hidden; height: 0;} .distribute-item figure img{ display: block; width: 100%; height: auto; transition: 0.8s;} .distribute-item1 .distributor-top{ position: absolute; width: 100%; left: 0; top: 100%;} .distribute-item:hover .distributor-wrap img{ transform: translateY(-8px);} .distribute-item:hover figure img{ transform: scale(1.07);} .cnews{ padding-top: 100px;} .poster-main{ margin: auto; position: relative;} .poster-main .poster-list{ position: relative; } .news-items{ padding-top: 16px; width: 1070px; height: 314px; position: absolute; left: 0; top: 0; background: none;} .news-items.active a{ background-color: #f4f4f4; box-shadow: 0 0 28px rgba(0,0,0,0.2);} .news-items.active a .news-logo{ opacity: 1; visibility: visible; transition: 0.2s;} .news-items.active{ opacity: 1 !important;} .news-items a{ background-color: #f8f8f8; height: 100%; position: relative; display: block;} .news-items a img{ display: block; width: 50.27%; -webkit-clip-path: polygon(0% 100%, 0% 0%, 68% 0, 100% 83%, 93% 100%); clip-path: polygon(0% 100%, 0% 0%, 68% 0, 100% 83%, 93% 100%);} .news-contents{ width: 40%; position: absolute; right: 48px; top: 38px; bottom: 40px; } .news-items.active a:hover .news-contents strong{ color: #e3811a;} .news-items.active a:hover .news-contents p{ color: #e3811a;} .news-items.active a:hover .news-contents time{ color: #e3811a;} .news-items.active a:hover .news-contents time span{ background: url(../images/btn1.png) center no-repeat; color: #e3811a;} .news-contents strong{ display: block; line-height: 1.4; color: #4d4d4d; font-size: 24px; text-align: right; transition: 0.4s; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} .news-contents p{ color: #4d4d4d; font-size: 16px; text-align: right; margin-top: 32px; transition: 0.4s; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} .news-contents time{ display: block; position: absolute; right: 0; bottom: 0; line-height: 23px; color: #4d4d4d; font-size: 19px; transition: 0.4s;} .news-contents time span{ display: inline-block; padding-left: 15px; width: 77px; height: 23px; line-height: 23px; color: #4d4d4d; font-size: 12px; background: url(../images/btn2.png) center no-repeat; vertical-align: middle; margin-left: 14px; transition: 0.4s;} .news-logo{ display: block; padding-left: 32px; width: 76px; height: 36px; line-height: 36px; color: #ffffff; font-size: 20px; font-weight: bold; position: absolute; left: 0; top: -18px; background-color: #e3811a; font-style: normal; font-weight: normal; text-align: left; opacity: 0; visibility: hidden; transition: 0.36s; z-index: 6;} .news-logo:before{ content: ""; width: 0; height: 0; border-top: 18px solid transparent; border-bottom: 18px solid transparent; border-left: 10px solid #e3811a; position: absolute; right: -10px; top: 0;} .poster-btn{ width: 41px !important; height: 36px !important; cursor: pointer; position: absolute; top: 50%; margin-top: -2px; z-index: 10;} .poster-btn.poster-prev-btn{ left: -64px; background: url(../images/prev1.png) center no-repeat;} .poster-btn.poster-next-btn{ right: -64px; background: url(../images/next1.png) center no-repeat;} .popUpblack{ background:#000\9; filter:alpha(opacity=80); background:rgba(0,0,0,0.8); width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: 1010; display: none;} .popUp { width: 220px; border: 2px solid #e3811a; background: #fff; position: fixed; left: 50%; top: 50%; margin: -87px 0 0 -115px; z-index: 1004; } .popUp .t { padding: 0 0 0 10px; height: 26px; line-height: 26px; color: #666; font-weight: bold; border-bottom: 1px solid #e8e8e8; background: #f2f2f2; } .popUp .t .close{ padding: 0 10px 0 0; float: right; cursor: pointer; color: #666; font-weight: normal;} .popUp .img { padding: 20px; } .popUp .img img { width: 100%; display: block;} .dynamic-box{ padding: 114px 0 95px;} .dynamic-list{ position: relative; margin: auto;} .dynamic-item{ position: absolute; opacity: 1 !important; line-height: 0;} .dynamic-item a{ box-shadow: 0 0 40px rgba(0,0,0,0.4); display: block;} .dynamic-item figure{ display: block; overflow: hidden;} .dynamic-item figure img{ display: block; width: 100%; height: auto; transition: 0.56s;} .dynamic-down{ background-color: #e3811a; position: relative; padding: 10px 15px 18px;} .dynamic-down strong{ margin-bottom: 8px; display: block; color: #fff; font-size: 20px; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .dynamic-down time{ display: block; line-height: 1; color: #fff; font-size: 12px;} .dynamic-down span{ position: absolute; right: 16px; bottom: 15px; display: block; padding-left: 9px; width: 56px; height: 16px; line-height: 16px; color: #fff; font-size: 12px; background: url(../images/btn3.png) center no-repeat; background-size: cover; font-size: 10px;} .dynamic-down span i{ display: block; font-style: normal; margin-left: -6px; transform: scale(0.8);} .dynamic-item:hover figure img{ transform: scale(1.05);} .dynamic-list .poster-btn{ display: none;} .read-more{ margin-top: 48px; text-align: center;} .read-more a{ display: block; width: 138px; height: 23px; line-height: 23px; background: url(../images/btn4.png) center no-repeat; color: #e3811a; font-size: 16px; margin: auto; font-weight: bold;} .foorters{ padding: 0 108px; background-color: #e6e6e6; position: relative; z-index: 3; overflow: hidden;} .foorters:before{ content: ""; width: 996px; height: 688px; background: url(../images/footerbg1.png) center no-repeat; position: absolute; right: 0; bottom: 0; z-index: -1;} .footers-top{ padding: 36px 0 24px; border-bottom: 2px solid #666666;} .footer-logo{ display: block; float: left; width: 301px;} .footer-logo img{ width: 100%; height: auto;} .footer-share{ float: right; margin-top: 3px;} .footer-share a{ display: block; width: 47px; float: left; margin-left: 15px; transition: 0.4s;} .footer-share a img{ width: 100%; display: block;} .footer-share a:hover{ transform: translateY(-4px);} .footer-navs{ padding: 26px 0 40px; border-bottom: 3px solid #4d4d4d;} .footer-navs-list{ float: left;} .footer-items{ display: block; float: left; margin-right: 76px;} .footer-items:last-child{ margin-right: 0;} .footer-items dt{ display: block; margin-bottom: 20px;} .footer-items dt a{ display: inline-block; color: #4d4d4d; font-size: 18px; font-weight: bold;} .footer-items dt a:hover{ color: #e3811a;} .footer-items dd{ display: block;} .footer-items dd p{ margin-bottom: 15px;} .footer-items dd p a{ display: inline-block; color: #4d4d4d; font-size: 14px;} .footer-items dd p a:hover{ color: #e3811a;} .footer-texts{ float: right;} .footer-texts small{ display: block; line-height: 1; color: #4d4d4d; font-size: 26px; font-family: "Bourbon-Grotesque-Regular-2"; margin-bottom: 14px; text-align: right;} .footer-texts p{ color: #4d4d4d; font-size: 17px;} .footer-copy{ padding: 22px 0 68px;} .footer-copy p,.footer-copy a{color: #4d4d4d;font-size: 14px;} .footer-copy a{ margin-left: 20px;} .footer-copy a:first-child{ margin-left: 0;} .menu { cursor: pointer; position: relative; text-align: center; z-index: 5; float: right; margin-right: 5%; margin-top: 14px;} #menu_toggle { display: none; } .menu span { position: relative; margin: auto; display: inline-block; width: 36px; height: 3px; background-color: #999; vertical-align: middle; -webkit-transition-duration: .3s,.3s; -moz-transition-duration: .3s,.3s; -ms-transition-duration: .3s,.3s; -o-transition-duration: .3s,.3s; transition-duration: .3s,.3s; -webkit-transition-delay: .3s,0s; -moz-transition-delay: .3s,0s; -ms-transition-delay: .3s,0s; -o-transition-delay: .3s,0s; transition-delay: .3s,0s; margin-top: -2px; } .menu span:after, .menu span:before { content: ""; position: absolute; display: inline-block; width: 100%; height: 3px; left: 0; background-color: #999; -webkit-transition-duration: .3s,.3s; -moz-transition-duration: .3s,.3s; -ms-transition-duration: .3s,.3s; -o-transition-duration: .3s,.3s; transition-duration: .3s,.3s; -webkit-transition-delay: .3s,0s; -moz-transition-delay: .3s,0s; -ms-transition-delay: .3s,0s; -o-transition-delay: .3s,0s; transition-delay: .3s,0s; } .menu span:before { top: -10px; -webkit-transition-property: top,transform; -moz-transition-property: top,transform; -ms-transition-property: top,transform; -o-transition-property: top,transform; transition-property: top,transform; } .menu span:after { bottom: -10px; -webkit-transition-property: bottom,transform; -moz-transition-property: bottom,transform; -ms-transition-property: bottom,transform; -o-transition-property: bottom,transform; transition-property: bottom,transform; } .menu.active span { background-color: transparent; -webkit-transition-delay: 0s,0s; -moz-transition-delay: 0s,0s; -ms-transition-delay: 0s,0s; -o-transition-delay: 0s,0s; transition-delay: 0s,0s; } .menu.active span:after, .menu.active span:before { -webkit-transition-delay: 0s,.3s; -moz-transition-delay: 0s,.3s; -ms-transition-delay: 0s,.3s; -o-transition-delay: 0s,.3s; transition-delay: 0s,.3s; } .menu.active span:before { top: 0px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .menu.active span:after { bottom: 0px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .searchBox { position: absolute; left: 0px; top: 73px; background-color: #84868a; width: 100%; z-index: 10; display: none; } .searchBox .search-btn, .searchBox .search-txt { margin: 0px; float: left; display: block; border: 0px none; } .search-txt { width: 94%; padding: 15px 2%; height: 22px; line-height: 22px; background-color: transparent; } .search-btn { width: 94px; height: 52px; color: #ffffff; line-height: 52px; background-color: #6f7177; position: absolute; right: 0px; top: 0px; font-size: 16px; } .menu-list { display: none; width: 420px; background: #ededed; position: fixed; right: -420px; top: 0; height: 100%; box-sizing: border-box; padding-top: 73px; overflow-y: auto; padding-bottom: 73px; transition: all 500ms cubic-bezier(0.000, 0.995, 0.990, 1.000); -webkit-transition: all 500ms cubic-bezier(0.000, 0.995, 0.990, 1.000); } .menu-list.on { right: 0; } .menu-list:before { content: ""; width: 1px; height: 100%; background: #dfdfdf; position: absolute; left: 0; top: 0; } .menus > li { border-bottom: 1px solid #cecece; } .menus > li > a { display: block; position: relative; color: #333333; font-size: 16px; line-height: 73px; padding-left: 60px; } .menus > li > a:before { content: ""; width: 12px; height: 6px; background: url(../images/arrow2.png) center no-repeat; position: absolute; right: 11.4%; top: 50%; margin-top: -3px; opacity: 0; visibility: hidden; transition: 300ms; } .menus > li.on { border-bottom: #ededed; } .menus > li.on > a { background: #f6792b; color: #fff; } .menus > li.on > a:before { opacity: 1; visibility: visible; } .menufix { padding: 14px 0; display: none; background: #fff; } .menufix li a { display: block; padding-left: 60px; line-height: 60px; color: #333333; font-size: 14px; } .navhome { float: left; background: #f6792b; } .navhome a { display: block; width: 104px; height: 62px; background: url(../images/home.png) center no-repeat; } .nav { float: right; margin-top: 25px; } .nav li { float: left; margin-left: 74px; } .nav li:first-child { margin-left: 0; } .nav li a { display: block; color: #000000; font-size: 16px; line-height: 1; } .nav li:hover a, .nav li.creent a { color: #f6792b; } .banner { position: relative; overflow: hidden; } .banner .bannerbox li { height: 100%; line-height: 0; opacity: 0; transition: opacity 1000ms linear; -webkit-transition: opacity 1000ms linear; float: left; overflow: hidden; } .banner .bannerbox li img { line-height: 0; width: 100%; position: relative; transition: transform 5s ease; -webkit-transition: transform 5s ease; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); } .banner .bannerbox li img.mimg { display: none; } .banner .bannerbox li.imgIn img { transform: matrix(1.1, 0, 0, 1.1, 0, 0); -webkit-transform: matrix(1.1, 0, 0, 1.1, 0, 0); } .banner .bannerbox li .bwr { opacity: 0; visibility: hidden; transform: translateX(60px); -webkit-transform: translateX(60px); -moz-transform: translateX(60px); } .banner .bannerbox li.imgIn .bwr { opacity: 1; z-index: 10; visibility: visible; transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); transition: 788ms; } .btext { position: absolute; left: 50%; margin-left: -640px; top: 50%; margin-top: -112px; } .bwr h2 { color: #ffffff; font-size: 71px; line-height: 1; margin-bottom: 12px; } .bwr span { display: block; color: #fff; font-size: 34px; padding-bottom: 10px; position: relative; line-height: 1.8; } .bwr span:before { content: ""; width: 236px; height: 1px; background: #fff; position: absolute; left: 0; bottom: 0; } .bwr small { display: block; color: #fff; font-size: 18px; font-family: "Arial"; line-height: 1.3; margin-top: 24px; text-transform: uppercase; } .micro { padding: 53px 0 50px; background: #fff; } .micro-list { text-align: center; margin-bottom: 40px; } .micro-info { display: inline-block; text-align: center; margin-right: 172px; } .micro-info:last-child { margin-right: 0; } .micro-info strong { display: block; width: 70px; height: 70px; margin: auto; margin-bottom: 18px; position: relative; } .micro-info small { display: block; text-align: center; color: #84868a; font-size: 20px; font-family: "helvetica_neue_ltregular"; text-transform: uppercase; line-height: 1; } .micro-info span { display: block; text-align: center; color: #84868a; font-size: 14px; margin-top: 8px; line-height: 1; font-size: 14px; font-weight: bold; } .micro-info:nth-child(1) strong { background: url(../images/pho1.png) center no-repeat; } .micro-info:nth-child(2) strong { background: url(../images/pho2.png) center no-repeat; } .micro-info:nth-child(3) strong { background: url(../images/pho3.png) center no-repeat; } .micro-info:hover strong { -webkit-transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8); transition-timing-function: cubic-bezier(0.6, 4, 0.3, 0.8); -webkit-animation: BOUNCE 0.6s 1; animation: BOUNCE 0.6s 1; animation-iteration-count: infinite; } .eggs-info:hover .more { opacity: 1; top: 0; filter: alpha(opacity=100); } @-moz-keyframes BOUNCE { 0% { top: 0; } 25% { top: -5px; } 50% { top: -10px; } 75% { top: -5px; } 100% { top: 0; } } @-webkit-keyframes BOUNCE { 0% { top: 0; } 25% { top: -5px; } 50% { top: -10px; } 75% { top: -5px; } 100% { top: 0; } } .microtext { width: 874px; margin: auto; } .microtext p { color: #6f7177; font-size: 18px; text-align: center; margin-bottom: 30px; font-weight: bold; line-height: 2; } .micromore { width: 123px; position: relative; margin: auto; } .micromore:before { content: ""; width: 100%; height: 100%; background: #f6792b; position: absolute; left: 0; top: 0; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transition: 300ms; opacity: 0; visibility: hidden; } .micromore a { display: block; width: 119px; height: 37px; text-align: center; position: relative; color: #f6792b; font-size: 13px; line-height: 37px; z-index: 5; text-transform: uppercase; border: 2px solid #f6792b; } .micromore:hover:before { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); } .micromore:hover a { color: #fff; } .creatvalue{ position: relative;} .lovelife { width: 63.25%; background: #f6792b; float: left; height: 100%; position: absolute; left: 0; top: 0;} .lovewr { width: 782px; float: right; margin-right: 32px; position: relative; padding: 38px 0; } .lovewr h3 { color: #fff; line-height: 1; font-size: 30px; margin-bottom: 8px; } .lovewr small { display: block; color: #f5aa7b; font-size: 18px; font-family: "Arial"; line-height: 1; margin-bottom: 30px; } .lovewr p { color: #ffffff; font-size: 16px; } .lovewr span { display: block; padding-right: 22px; position: absolute; right: 0; bottom: 46px; line-height: 1; font-size: 14px; color: #fff; } .lovewr span:before { content: ""; width: 13px; height: 13px; background: #fff url(../images/arrow.png) center no-repeat; position: absolute; right: 0; top: 1px; } .creatimg { float: right; width: 36.75%; } .creatimg img { display: block; width: 100%; height: auto; line-height: 1; } .dynamic { padding: 48px 0; background: #f7f7f7; } .cdynamic { width: 61.4%; float: left; background: #fff; } .cdynamicwr { padding: 46px 40px 35px 38px; } .cdynamicwr h3, .personnelwr h3 { color: #666666; font-size: 30px; line-height: 1; padding-bottom: 17px; border-bottom: 1px solid #e8e8e8; } .cdynamicwr h3 small, .personnelwr h3 small { display: inline-block; color: #f6792b; font-size: 18px; font-weight: normal; margin-left: 12px; position: relative; } .cdynamic-info { margin-top: 50px; margin-bottom: 76px; padding-left: 3px; } .cdynamic-info figure { display: block; overflow: hidden; width: 28.3%; float: left; } .cdynamic-info figure img { display: block; width: 100%; line-height: 1; transition: 488ms; } .cdnamictext { width: 67.82%; float: right; } .cdnamictext h4 { color: #000000; font-size: 18px; transition: 320ms; font-weight: normal; margin-bottom: 16px; line-height: 1.4; } .cdnamictext time { display: block; line-height: 1; color: #999999; margin-bottom: 14px; } .cdnamictext p { color: #8f8f8f; font-size: 14px; } .cdynamic-info:hover figure img { transform: scale(1.07); -webkit-transform: scale(1.07); -moz-transform: scale(1.07); } .cdynamic-info:hover .cdnamictext h4 { color: #f6792b; } .morenew { display: inline-block; } .morenew a { display: block; position: relative; padding-right: 26px; line-height: 1; color: #666666; font-size: 14px; } .morenew a:before { content: ""; width: 13px; height: 13px; background: #f6792b url(../images/arrow1.png) center no-repeat; position: absolute; right: 6px; top: 0; transition: 300ms; } .morenew a:hover { color: #f6792b; } .morenew a:hover:before { right: 0px; } .personnel { width: 33.6%; float: right; background: #fff; position: relative; } .personnelwr { padding: 46px 0 0; } .personnelwr h3 { padding: 0 40px 17px; } .personnelfix { position: relative; padding-top: 110px; height: 190px; } .personnelfix img { display: block; width: 100%; height: auto; line-height: 1; position: absolute; left: 0; bottom: 0; } .positions { text-align: center; position: relative; z-index: 5; padding-left: 105px; } .positions strong { display: inline-block; float: left; line-height: 1; color: #f6792b; font-size: 72px; font-family: "Arial"; } .posite { float: left; padding-top: 4px; margin-left: 10px; } .posite b { color: #f6792b; font-size: 24px; line-height: 1.4; display: block; } .posite span { display: block; color: #f6792b; font-size: 15px; font-weight: bold; } .personnelfix .morenew { position: absolute; right: 40px; bottom: 24px; } .footer-box { padding: 58px 0 92px; position: relative; background: #fff; } .footer-box:before { content: ""; width: 100%; height: 15px; background: url(../images/bottbg.jpg) center no-repeat; position: absolute; left: 0; bottom: 0; background-size: 100% 100%; } .footer { position: relative; } .footerlogo { margin-bottom: 60px; } .footerlogo img { display: block; float: left; line-height: 1; } .innova { float: left; margin-left: 28px; } .innova small { display: block; color: #666666; font-size: 24px; line-height: 0.9; font-weight: bold; } .innova span { display: block; color: #666666; font-size: 14px; margin-top: 6px; line-height: 1; } .eqs { position: absolute; right: 0; top: 10px; } .eqs a { display: block; float: left; margin-left: 14px; width: 40px; height: 40px; } .eqs a:nth-child(1) { background: url(../images/play.png) center no-repeat; } .eqs a:nth-child(2) { background: url(../images/weix.png) center no-repeat; } .eqs a:hover { transform: translateY(-5px); -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); } .relative { padding-bottom: 45px; padding-left: 4px; border-bottom: 1px solid #b7b7bc; } .relatives { display: block; float: left; width: 130px; } .relatives dt { display: block; margin-bottom: 20px; } .relatives dt a { display: block; line-height: 1; color: #666666; font-size: 15px; font-weight: bold; } .relatives dd { display: block; } .relative-info { margin-bottom: 12px; } .relative-info a { display: inline-block; color: #666666; line-height: 1; } .relative-info a:hover { color: #f6792b; } .edites { padding-top: 28px; } .edites p { float: left; line-height: 1; color: #666666; } .edites a { display: inline-block; float: right; line-height: 1; color: #666666; } .edites a:hover { color: #f6792b; } .popUpblack { background: #000\9; filter: alpha(opacity=80); background: rgba(0,0,0,0.8); width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: 1010; display: none; } .popUp { width: 220px; height: 242px; border: 2px solid #f6792b; background: #fff; position: fixed; left: 50%; top: 50%; margin: -87px 0 0 -115px; z-index: 1004; } .popUp .t { padding: 0 0 0 10px; height: 26px; line-height: 26px; color: #666; font-weight: bold; border-bottom: 1px solid #e8e8e8; background: #f2f2f2; } .popUp .t .close { padding: 0 10px 0 0; float: right; cursor: pointer; color: #666; font-weight: normal; } .popUp .img { padding: 20px; } .popUp .img img { width: 100%; display: block; } .chanhenbox { padding: 20px 0 0; background: #f8f8f8; position: relative; z-index: 30; } .aboubox { margin-bottom: 52px; } .aboubox small { display: block; color: #222222; font-size: 36px; font-family: "Arial"; text-transform: uppercase; margin-bottom: 13px; } .aboutex { padding-left: 15px; border-left: 1px solid #f6792b; } .aboutex p { color: #666666; font-size: 14px; line-height: 1.4; } .leval-list { float: left; } .leval-list li { float: left; margin-right: 46px; } .leval-list li a { display: block; padding: 0 2px; color: #333333; font-size: 16px; padding-bottom: 18px; position: relative; line-height: 1; } .leval-list li a:before { content: ""; width: 100%; height: 4px; background: #f68e56; position: absolute; left: 0; bottom: 0; transform-origin: 100%; -webkit-transform-origin: 100%; -webkit-transition: -webkit-transform .4s cubic-bezier(.4,0,.2,1); transition: -webkit-transform .4s cubic-bezier(.4,0,.2,1); transition: transform .4s cubic-bezier(.4,0,.2,1); transition: transform .4s cubic-bezier(.4,0,.2,1),-webkit-transform .4s cubic-bezier(.4,0,.2,1); transform: scaleX(0); -webkit-transform: scaleX(0); visibility: hidden\9; } .leval-list li a:hover:before, .leval-list li a.on:before { transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transform-origin: 0; -webkit-transform-origin: 0; visibility: visible\9; } .leval-list li a:hover, .leval-list li a.on { color: #f68e56; } .posited { float: right; margin-bottom: 15px; } .posited b { display: inline-block; float: left; width: 13px; height: 5px; background: url(../images/arrow3.png) center no-repeat; margin: 8px 8px 0; } .posited a { display: block; float: left; line-height: 19px; height: 19px; min-width: 20px; color: #999999; font-size: 14px; } .posited a.home { background: url(../images/home2.png) center no-repeat; } .posited a.home:hover { background: url(../images/home3.png) center no-repeat; } .posited a:hover, .posited a.now { color: #f6792b; } .introductbox { background: #fff; border-bottom: 1px solid #cccccc; } .introtext { width: 60%; float: left; } .introwr { padding-top: 105px; width: 72.5%; padding-bottom: 50px; margin: auto; } .introtext strong { display: block; line-height: 1; color: #f8f8f8; font-family: "Arial"; text-transform: uppercase; font-weight: normal; font-size: 64px; } .introtext h3 { color: #666666; font-size: 30px; line-height: 1.5; font-weight: normal; } .introtext small { display: block; color: #8e8a8a; line-height: 1; text-transform: uppercase; } .introfix { margin-top: 40px;text-align:justify; } .introfix p { color: #666666; font-size: 14px; line-height: 2; } .introimg { width: 40%; float: right; line-height: 0; } .introimg img { width: 100%; height: auto; line-height: 0; } .iphone-fix { width: 100%; background: #f6792b; display: none; position: relative; } .iphone-fix span { color: #fff; display: block; text-align: center; font-size: 18px; height: 46px; line-height: 46px; cursor: pointer; } .iphone-fix.scoll { position: fixed; left: 0; top: 90px; } .iphone-fix span em { color: #fff; font-size: 14px; font-style: normal; line-height: 46px; display: inline-block; } .iphone-fix span b { display: inline-block; margin-left: 5px; width: 18px; height: 9px; background: url(../images/arrow4.png) center no-repeat; } .iphone-down { width: 100%; position: absolute; left: 0; display: none; top: 46px; background: #ddd; } .iphone-down a { display: block; width: 50%; float: left; font-size: 18px; text-align: center; height: 42px; line-height: 42px; color: #222222; position: relative; overflow: hidden; border: none !important; } .iphone-down a:hover, .iphone-down a.on { background: rgba(248,248,248,0.7); } .iphone-down a:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; z-index: 1; background-color: #edebeb; -webkit-animation-duration: 0.7s; animation-duration: 0.7s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: ReturnToNormal; animation-name: ReturnToNormal; } @-webkit-keyframes ReturnToNormal { 0% { -webkit-transform: scale(0.1,1); -ms-transform: scale(0.1,1); transform: translate: scale(0.1,1); } 100% { -webkit-transform: scaleX(1,1); -ms-transform: scale(1,1); transform: translate: scaleX(1,1); } } @keyframes ReturnToNormal { 0% { -webkit-transform: scale(0.1,1); -ms-transform: scale(0.1,1); transform: translate: scale(0.1,1); } 100% { -webkit-transform: scaleX(1,1); -ms-transform: scale(1,1); transform: translate: scaleX(1,1); } } .speed-box { padding-top: 24px; padding-bottom: 74px; background: #fff; border-bottom: 1px solid #cccccc; } .speedimg { width: 21.56%; float: left; } .speedimg img { display: block; width: 100%; height: auto; } .speeddown { margin-top: 23px; padding-bottom: 8px; border-bottom: 2px solid #cccccc; } .speeddown h2 { line-height: 1; color: #666666; font-size: 30px; margin-bottom: 18px; } .speeddown h2 small { display: inline-block; color: #666666; font-size: 14px; line-height: 1; position: relative; margin-left: 10px; } .speeddown span { display: block; text-align: right; color: #999999; font-size: 14px; line-height: 1; } .speeddown span b { display: inline-block; font-size: 12px; font-family: "Arial"; margin-left: 7px; } .speeds { width: 74.8%; float: right; background: #fbfbfb; } .speedwr { padding: 44px 50px 48px 40px; text-align:justify;} .speedwr p { color: #666666; font-size: 14px; line-height: 2; } .speeddowned { margin-top: 74px; } .speeddowned span { display: block; text-align: right; color: #666666; font-size: 14px; } .team-list li { position: relative; } .team-list li:before { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #f8f8f8; opacity: 0; visibility: hidden; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transition: 570ms; } .team { position: relative; padding: 40px 0; } .team:before { content: ""; width: 100%; height: 1px; border-bottom: 1px dashed #bebebe; position: absolute; left: 0; bottom: 0; transition: 388ms; } .team figure { display: block; line-height: 1; overflow: hidden; width: 16.8%; float: left; } .team figure img { display: block; width: 100%; height: auto; line-height: 1; transition: 588ms; } .teamfix { width: 62.5%; float: left; margin-left: 48px; padding-top: 15px; } .teamfix h3 { line-height: 1; color: #666666; transition: 388ms; font-size: 24px; margin-bottom: 10px; } .teamfix h3 small { display: inline-block; margin-left: 8px; font-weight: normal; font-size: 12px; } .teamfix span { display: block; color: #999999; font-size: 14px; margin-bottom: 20px; } .teamfix p { color: #666666; font-size: 14px; line-height: 2; } .team-list li:hover:before { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); } .team-list li:hover .team:before { opacity: 0; visibility: hidden; } .team-list li:hover .team figure img { transform: scale(1.07); -webkit-transform: scale(1.07); -moz-transform: scale(1.07); } .team-list li:hover .teamfix h3 { color: #f6792b; } .team-list li:hover .teamfix h3 small { color: #666666; } .pagelist { margin-top: 62px; text-align: center; } .page { position: relative; margin: auto; display: inline-block; } .pagelist a, .pagelist span { display: inline-block; width: 39px; height: 39px; text-align: center; line-height: 39px; color: #ffffff; font-size: 18px; font-family: "humanst521_btregular"; margin-right: 12px; background: #bfbfbf; float: left; } .pagelist a:last-child { margin-right: 0; } .pagelist a:hover, .pagelist a.on, .pagelist span { background: #f6792b; } .pagelist a.pageprev { background: #bfbfbf url(../images/arrow5.png) 13px center no-repeat; } .pagelist a.pagelast { background: #bfbfbf url(../images/arrow6.png) 12px center no-repeat; } .pagelist a.pageprev:hover { background: #f6792b url(../images/arrow5.png) 11px center no-repeat; } .pagelist a.pagelast:hover { background: #f6792b url(../images/arrow6.png) 14px center no-repeat; } .organizatefix { margin-bottom: 54px; } .organizate { margin-top: 40px; margin-bottom: 28px; } .organizatefix h3 { color: #666666; font-size: 24px; line-height: 1; text-align: center; margin-bottom: 8px; } .organizatefix small { display: block; text-align: center; color: #999999; font-family: "Arial"; line-height: 1; text-transform: uppercase; } .organizas { border: 1px solid #cccccc; } .organizate-info { position: relative; width: 33.3333333%; float: left; } .organizate-info:before { content: ""; width: 1px; height: 100%; background: #ccc; position: absolute; right: 0; top: 0; } .organizate-info:nth-child(3n+3):before { display: none; } .orgazatop { border-bottom: 1px solid #ccc; text-align: center; padding: 30px 0 38px; position: relative; background: #fbba2e; } .orgazatop:before { content: ""; width: 21px; height: 18px; background: url(../images/arrow7.png) center no-repeat; position: absolute; left: 50%; margin-left: -10px; bottom: -35px; } .orgazatop b { display: block; width: 36px; position: relative; height: 36px; margin: auto; margin-bottom: 10px; text-align: center; } .orgazatop b img { display: block; margin: auto; position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .orgazatop h4 { color: #ffffff; font-size: 18px; text-align: center; line-height: 1.6; } .orgazatop small { display: block; color: #ffffff; text-align: center; font-family: "Arial"; text-transform: uppercase; } .organizate-info:nth-child(2) .orgazatop { background: #1c6b41; } .organizate-info:nth-child(2) .orgazatop:before { background: url(../images/arrow8.png) center no-repeat; } .organizate-info:nth-child(3) .orgazatop { background: #24538d; } .organizate-info:nth-child(3) .orgazatop:before { background: url(../images/arrow9.png) center no-repeat; } .orgatefix { padding: 68px 20px 38px; height: 228px; } .orgatefix p { color: #666666; font-size: 15px; text-align: center; line-height: 2.2; } .history-box { padding: 67px 0; position: relative; } .historyimg, .personimg { width: 100%; height: 100%; background-size: cover !important; background-repeat: no-repeat; background-position: center top; position: absolute; left: 0px; top: 0px; z-index: -1; } .history-t{ display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; } .historyfix { background: #fff; float: left; margin-right: 5px; padding:35px 25px; position: relative; cursor: pointer; } .historyfix:last-child { margin-right: 0; } .historyfix strong { display: block; line-height: 1; font-weight: normal; color: #666666; font-size: 38px; margin-bottom: 15px; font-family: "humanst521_btregular"; transition: 300ms; } .historyfix span { display: block; color: #666666; font-size: 14px; font-weight: bold; line-height: 1; transition: 300ms; } .line1:before { content: ""; width: 96.8%; left: 1.6%; position: absolute; top: 3.76%; height: 1px; background: #f6792b; opacity: 0; visibility: hidden; transform: scaleX(0); -webkit-transform: scaleX(0); -moz-transform: scaleX(0); transition: 300ms 0ms; transform-origin: left top; -webkit-transform-origin: left top; } .line1:after { content: ""; width: 1px; height: 92.48%; background: #f6792b; position: absolute; right: 1.6%; top: 3.76%; opacity: 0; visibility: hidden; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transition: 300ms 0ms; transform-origin: right top; -webkit-transform-origin: right top; } .line2:before { content: ""; width: 96.8%; right: 1.6%; position: absolute; bottom: 3.76%; height: 1px; background: #f6792b; opacity: 0; visibility: hidden; transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); transition: 320ms 0ms; transform-origin: right bottom; -webkit-transform-origin: right bottom; } .line2:after { content: ""; width: 1px; height: 92.48%; background: #f6792b; position: absolute; left: 1.6%; bottom: 3.76%; transform-origin: left bottom; -webkit-transform-origin: left bottom; opacity: 0; visibility: hidden; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transition: 300ms 0ms; } .historyfix:hover strong, .historyfix.on strong { color: #f6792b; } .historyfix:hover span, .historyfix.on span { color: #f6792b; } .historyfix:hover .line1:before, .historyfix.on .line1:before { opacity: 1; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transition: 320ms 0ms; } .historyfix:hover .line1:after, .historyfix.on .line1:after { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transition: 320ms 120ms; } .historyfix:hover .line2:before, .historyfix.on .line2:before { opacity: 1; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transition: 320ms 240ms; } .historyfix:hover .line2:after, .historyfix.on .line2:after { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transition: 320ms 360ms; } .historyed { margin-top: 75px; } .historytext { position: relative; padding-bottom: 76px; } .historytext:before { content: ""; width: 1px; height: 100%; background: #fff; position: absolute; left: 0; top: -2px; } .histitle { top: -19px; margin-left: 20px; margin-bottom: 44px; position: relative; } .histitle:before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; position: absolute; left: -23px; top: 15px; } .histitle strong { display: block; padding-left: 54px; color: #fff; line-height: 40px; background: url(../images/hist.png) left center no-repeat; position: relative; left: -6px; font-weight: normal; font-family: "humanst521_btregular"; font-size: 36px; } .histitle p { color: #ffffff; font-size: 16px; margin-top: 8px; } .history-list li { position: relative; padding-left: 20px; margin-bottom: 37px; } .history-list li:before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; position: absolute; left: -3px; top: 4px; } .history-list li time { display: block; color: #ffffff; font-size: 18px; font-weight: bold; font-family: "humanst521_btregular"; line-height: 1; margin-bottom: 28px; } .histofix { width: 620px; } .histofix img { width: 192px; height: auto; transition: 340ms; line-height: 1; float: left; } .histofix p { color: #ffffff; font-size: 16px; line-height: 1.8; float: right; width: 410px; transition: 320ms; } .history-list li:hover .histofix img { transform: translateY(-5px); -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); } .history-list li:hover .histofix p { color: #f6792b; } .culturebox { padding: 72px 0 72px; background-size: cover !important; } .culture-info { width: 33%; margin-right: 0.5%; float: left; } .culture-info:nth-child(3n+3) { margin-right: 0; } .cultureicon { text-align: center; margin-bottom: 12px; } .cultureicon b { display: block; width: 52px; height: 54px; margin: auto; margin-bottom: 12px; line-height: 1; position: relative; } .cultureicon span { display: block; text-align: center; line-height: 1; color: #333333; font-size: 16px; } .cultureicon b img { display: block; max-width: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; transition: 320ms; } .cultureicon b img.hideimg { opacity: 0; visibility: hidden; } .culture-info:hover .cultureicon b img.showimg { opacity: 0; visibility: hidden; } .culture-info:hover .cultureicon b img.hideimg { opacity: 1; visibility: visible; } .cultured { text-align: center; } .culbg { width: 255px; height: 34px; background: url(../images/curbg.png) center no-repeat; margin: auto; position: relative; transition: 388ms; } .culbg:before { content: ""; width: 16px; height: 14px; background: url(../images/arrow10.png) center no-repeat; position: absolute; left: 50%; margin-left: -8px; top: 9px; } .culturetext { background: rgba(255,255,255,0.9); background: #fff\9; filter: alpha(opacity=90); padding: 52px 34px 36px; height: 327px; position: relative; transition: 388ms; } .culturetext b { display: block; color: #666666; font-size: 18px; margin-bottom: 17px; text-align: left; } .culturetext p { color: #333333; font-size: 14px; line-height: 2; text-align: left; } .culture-info:hover .culturetext { background: rgba(255,255,255,1); background: #fff\9; filter: alpha(opacity=100); } .culture-info:hover .culbg { background: url(../images/curbg1.png) top center no-repeat; } .culture-info:hover .line1:before { opacity: 1; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transition: 340ms 0ms; } .culture-info:hover .line1:after { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transition: 340ms 180ms; } .culture-info:hover .line2:before { opacity: 1; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transition: 340ms 360ms; } .culture-info:hover .line2:after { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transition: 340ms 540ms; } .valuebg { background: #fff; padding: 68px 0 115px; border-bottom: 1px solid #ccc; } .corevalue .organizatefix { margin-bottom: 0; } .innvovate { margin-top: 10px; padding-top: 44px; position: relative; } .innvovate:before { content: ""; width: 1px; height: 44px; position: absolute; left: 50%; top: 0; background: #cccccc; } .innvotewr { position: relative; border: 1px solid #ccc; } .innvotewr i { display: block; width: 1px; height: 100%; background: #ccc; position: absolute; left: 50%; top: 0; } .innvoates { width: 50%; float: left; } .innvoates strong { display: block; position: relative; border-bottom: 1px solid #ccc; padding-top: 40px; height: 67px; text-align: center; line-height: 1; color: #f6792b; font-size: 16px; } .innvoates strong:before { content: ""; width: 16px; height: 14px; background: url(../images/arrow11.png) center no-repeat; position: absolute; left: 50%; margin-left: -8px; bottom: 17px; } .innvotefix { padding: 50px 50px 67px; } .innvotefix p { color: #666666; font-size: 14px; } /*社会公益*/ .commonwealbox { background: #fff; border-top: 1px solid #d7e0ef; border-bottom: 1px solid #cccccc; } .commonwealtop { padding: 68px 0 34px; } .commonwealtop p { text-align: center; color: #6f7177; font-size: 14px; line-height: 2; } .commonwealist { padding-bottom: 80px; } .commonwealist > li { background: #f8f8f8; margin-top: 38px; } .wealtext { width: 50%; float: left; } .wealwr { padding: 57px 48px 0; } .wealwr h3 { color: #f6792b; font-size: 24px; line-height: 1; margin-bottom: 24px; } .wealwr h3 small { display: inline-block; margin-left: 12px; color: #d0ccc9; font-size: 14px; font-family: "Arial"; font-weight: normal; } .wealwr p { color: #666666; font-size: 14px; line-height: 2; } .commonwealist li figure { display: block; float: right; width: 50%; line-height: 0; overflow: hidden; } .commonwealist li figure img { display: block; width: 100%; height: auto; line-height: 1; transition: 2s; } .commonwealist li:hover figure img { transform: scale(1.04); -webkit-transform: scale(1.04); -moz-transform: scale(1.04); } .assistance { background: #fffbf1; padding-bottom: 25px; } .assistance > li { border-bottom: 1px dashed #d0d0d0; padding: 11px 14px 11px 58px; position: relative; background: url(../images/arrow12.png) 36px center no-repeat; color: #666666; font-size: 14px; transition: 300ms; } .assistance li a { color: #666; } .assistance li:hover a { color: #f6792b; } .assistance li:hover { background: url(../images/arrow15.png) 36px center no-repeat; } .employees { padding-top: 25px; padding-bottom: 80px; } .staf { padding-top: 35px; padding-bottom: 10px; border-bottom: 1px solid #d5d5d5; } .staf-sele { float: left; margin-top: 14px; } .staf-sele a { display: inline-block; float: left; padding: 0 18px; border-right: 1px solid #c9c9c9; line-height: 16px; color: #666666; font-size: 15px; } .staf-sele a:first-child { padding-left: 0; } .staf-sele a:last-child { padding-right: 0; border-right: none; } .staf-sele a:hover, .staf-sele a.on { color: #f6792b; } .staffow { float: right; } .staf-info { float: left; position: relative; margin-left: 14px; border-radius: 10px; background: #f8f6f6; } .staf-info:before { width: 100%; height: 100%; background: #f6792b; content: ""; position: absolute; left: 0; top: 0; border-radius: 10px; opacity: 0; visibility: hidden; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transition: 360ms; } .staf-info a { display: block; width: 140px; height: 38px; line-height: 38px; text-align: center; color: #666666; font-size: 16px; position: relative; } .staf-info:hover:before, .staf-info.on:before { opacity: 1; visibility: visible; transform: scaleY(1); } .staf-info:hover a, .staf-info.on a { color: #fff; } .staf-list { padding-top: 0; } .staf-list .team figure { width: 21.4%; position: relative; } .staf-list .teamfix { width: 76.1%; float: right; margin-left: 0; } .staf-list li .line1:before { height: 5px; width: 100%; top: 0; left: 0; } .staf-list li .line1:after { width: 5px; height: 100%; right: 0; top: 0; } .staf-list li .line2:before { height: 5px; width: 100%; bottom: 0; right: 0; } .staf-list li .line2:after { width: 5px; height: 100%; left: 0; bottom: 0; } .staf-list li:hover .line1:before { opacity: 1; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transition: 340ms 0ms; } .staf-list li:hover .line1:after { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transition: 340ms 180ms; } .staf-list li:hover .line2:before { opacity: 1; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); transition: 340ms 360ms; } .staf-list li:hover .line2:after { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); transition: 340ms 540ms; } .acivity { padding-top: 30px; } .acitivy-list li { position: relative; padding: 25px 0; } .acitivy-list li:before { content: ""; width: 100%; height: 100%; background: #f8f8f8; position: absolute; left: 0; top: 0; opacity: 0; visibility: hidden; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); transition: 400ms; } .acitivy-list li .acitivs { position: relative; } .acitivy-list li .acitivs:before { content: ""; width: 100%; height: 2px; background: #d7d7d7; position: absolute; left: 0; bottom: 0; } .acitivy-list li .acitivs figure { display: block; width: 39%; float: left; line-height: 1; overflow: hidden; position: relative; z-index: 5; } .acitivy-list li .acitivs figure img { display: block; width: 100%; height: auto; line-height: 1; transition: 540ms; } .activityfix { width: 61%; float: left; } .activiwr { padding: 10px 0 10px 30px; } .activiwr h3 { color: #666666; font-size: 18px; transition: 320ms; margin-bottom: 15px; line-height: 1.2; } .activiwr time { display: block; color: #999999; margin-bottom: 28px; line-height: 1; } .acvitytext { height: 130px; } .activiwr p { color: #666666; font-size: 14px; line-height: 2; } .readmore { position: relative; width: 123px; } .readmore:before { content: ""; width: 100%; height: 100%; background: #f6792b; position: absolute; left: 0; top: 0; transition: 310ms; opacity: 0; visibility: hidden; transform: scaleY(0); -webkit-transform: scaleY(0); -moz-transform: scaleY(0); } .activifux { padding-bottom: 74px; } .readmore span { display: block; border: 3px solid #cccccc; line-height: 35px; text-align: center; color: #999999; font-size: 13px; text-transform: uppercase; transition: 320ms; position: relative; } .acitivy-list li:hover:before { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); } .acitivy-list li:hover .acitivs figure img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); } .acitivy-list li:hover .activiwr h3 { color: #f6792b; } .acitivy-list li:hover .activiwr .readmore:before { opacity: 1; visibility: visible; transform: scaleY(1); -webkit-transform: scaleY(1); -moz-transform: scaleY(1); } .acitivy-list li:hover .activiwr .readmore span { color: #fff; border-color: #f6792b; } .windows-box { padding: 10px 0 65px; border-bottom: 1px solid #cccccc; background: #fff; } .window-list li { width: 17.18%; float: left; margin-top: 45px; margin-right: 3.5%; } .window-list li:nth-child(5n+5) { margin-right: 0; } .window-list li a { display: block; border: 1px solid #e5e5e5; } .window-list li a figure { display: block; line-height: 1; transition: 300ms; overflow: hidden; border-bottom: 1px solid #e5e5e5; } .window-list li a figure img { display: block; width: 100%; height: auto; line-height: 1; } .window-list li a span { display: block; text-align: center; background: #f8f6f6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 12px; line-height: 1.5; color: #666666; font-size: 15px; transition: 388ms; } .window-list li:hover a { border-color: #f6792b; } .window-list li:hover figure { border-color: #f6792b; } .window-list li:hover a span { color: #fff; background: #f6792b; } .business-box { background: #fff; position: relative; } .busineimg { width: 100%; height: auto; line-height: 1; } .business { padding: 56px 0 68px; } .phonetext { margin-top: -16px; } .phonetext p { text-align: center; color: #666666; font-size: 14px; } .advantage { padding: 30px 0 0; } .advantas { text-align: center; margin-bottom: 30px; } .adbant-info { display: inline-block; padding-right: 114px; text-align: center; position: relative; } .adbant-info:before { content: ""; width: 9px; height: 9px; background: url(../images/arrow13.png) center no-repeat; position: absolute; right: 40px; top: 50%; margin-top: -4px; } .adbant-info strong { display: block; text-align: center; color: #f6792b; font-size: 72px; font-family: "Arial"; line-height: 1; margin-bottom: 8px; font-weight: bolder; } .adbant-info span { display: block; text-align: center; color: #666666; font-size: 14px; line-height: 1; } .adbant-info:last-child { padding-right: 0; } .adbant-info:last-child:before { display: none; } .advans img { display: block; width: 100%; height: auto; line-height: 1; } .adbantage { margin-top: 54px; } .adbantage h3 { line-height: 1; margin-bottom: 30px; color: #f67b28; font-size: 24px; } .adbantage h3 small { display: inline-block; color: #cccccc; font-size: 14px; margin-left: 6px; font-weight: normal; font-family: "Arial"; } .adbantage p { color: #666666; font-size: 14px; line-height: 2; } .address { padding: 34px 0 68px; border-bottom: 1px solid #cccccc; background: #f7f7f7; } .address-info { width: 33.333333%; float: left; border-bottom: 1px dashed #cccccc; } .address-info b { float: left; width: 48px; height: 60px; position: relative; } .address-info b img { display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; max-width: 100%; max-height: 100%; margin: auto; } .address-info span { display: inline-block; float: left; padding-top: 24px; line-height: 1.3; color: #666666; font-size: 14px; } .address-info span a { color:#666666;} .finance-box { margin-top: 45px; } .finace { text-align: center; } .finace li { display: inline-block; margin-right: 44px; } .finace li:last-child { margin-right: 0; } .finace li img { display: block; width: 157px; height: auto; line-height: 1; border-radius: 50%; } .finacefix { background: #155c36; margin-top: 42px; } .finacefix figure { display: block; width: 61.25%; float: left; overflow: hidden; } .finacefix figure img { display: block; width: 100%; height: auto; } .finamce { float: left; width: 38.75%; } .finadewr { padding: 58px 46px 0; } .finadewr span { display: block; padding-left: 9px; font-size: 14px; color: #fff; margin-bottom: 4px; position: relative; } .commercial { padding: 68px 0 64px; } .estate { width: 46.87%; float: left; } .estate h3 { margin-bottom: 22px; color: #f6792b; font-size: 24px; line-height: 1; } .estate h3 small { display: inline-block; margin-left: 10px; color: #d0ccc9; font-size: 14px; font-family: "Arial"; font-weight: normal; } .estatetext { height: 180px; } .estate p { color: #666666; font-size: 14px; line-height: 2; } .estatefix .address-info { width: 100%; } .estateimg { width: 50%; float: right; overflow: hidden; } .estateimg img { display: block; width: 100%; height: auto; line-height: 1; transition: 488ms; } .investment { background: #f7f7f7; } .commercial:hover .estateimg img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); } .new-list .team { padding: 35px 0; position: relative; } .new-list .team figure { width: 20%; } .new-wr { position: relative; } .newtext { width: 77.8%; height: 100%; position: absolute; right: 0; top: 0; } .newtext h3 { color: #666666; font-size: 18px; line-height: 1.4; margin-bottom: 11px; transition: 340ms; } .newtext p { color: #666666; font-size: 14px; width: 83%; height: 50px; overflow: hidden; } .newtext time { display: block; padding-top: 44px; height: 20px; width: 76px; border: 1px solid #c9c9c9; border-radius: 8px; line-height: 1; color: #999999; text-align: center; background: url(../images/newtime.png) center 11px no-repeat; transition: 340ms; position: absolute; right: 0; top: 0; } .newtext span { display: block; width: 81px; height: 19px; text-align: center; line-height: 19px; color: #f6792b; border: 1px solid #f6792b; position: absolute; left: 0; bottom: 4px; transition: 340ms; } .new-list li:hover .newtext h3 { color: #f6792b; } .new-list li:hover .newtext time { color: #fff; background: #f6792b url(../images/newtime1.png) center 11px no-repeat; border-color: #f6792b; } .new-list li:hover .newtext span { color: #fff; background: #f6792b; } .nenwview { position: relative; padding-bottom: 54px; } .nenwview .aboubox { margin-bottom: 0; } .nenwview .levalmenu { position: absolute; right: 0; bottom: 54px; } .news { background: #f8f8f8; padding-bottom: 72px; border-bottom: 1px solid #cccccc; } .newfix { background: #fff; } .newtop { padding: 40px 0 30px; text-align: center; } .newtop h3 { text-align: center; color: #f6792b; font-size: 24px; line-height: 1.4; margin-bottom: 10px; } .newshare { display: inline-block; margin: auto; } .newshare time { display: inline-block; float: left; line-height: 20px; color: #999999; } .newshare .back { display: inline-block; float: left; line-height: 20px; color: #f68e56; margin: 0 12px; } .newshare span { display: inline-block; float: left; line-height: 20px; color: #666666; margin: 0 30px; } .share { float: left; } .share b { display: inline-block; float: left; line-height: 20px; color: #999999; font-size: 14px; font-weight: normal; margin-right: 10px; } .newdwn img { max-width: 100%; height: auto; line-height: 1; } .newview { width: 840px; margin: auto; text-align:justify;} .newview p { color: #666666; line-height: 1.8; font-size: 14px; text-align:justify;} .newdwn { border-bottom: 1px solid #cccccc; padding-bottom: 48px; } .piecebox { padding: 35px 46px; position: relative; } .piecebox i { content: ""; width: 1px; height: 100%; background: #cccccc; position: absolute; left: 50%; top: 0; } .piece-info { float: left; } .piece-info b { display: block; color: #666666; transition: 320ms; font-size: 15px; font-weight: normal; margin-bottom: 8px; } .piece-info span { display: block; color: #666666; transition: 320ms; font-size: 15px; } .piece-info:nth-child(2) { float: right; } .piece-info:nth-child(2) b { text-align: right; } .piece-info:nth-child(2) span { text-align: right; } .piece-info:hover b, .piece-info:hover span { color: #f6792b; } .newdwn img { max-width: 100%; height: auto; line-height: 1; } .videofix { padding: 5px 0 78px; border-bottom: 1px solid #cccccc; background: #fff; } .video-list li { width: 49%; float: left; margin-top: 53px; } .video-list li:nth-child(2n+2) { float: right; } .video-list li figure { display: block; position: relative; overflow: hidden; line-height: 0; } .video-list li figure img { display: block; width: 100%; height: auto; line-height: 1; transition: 455ms; } .video-list li figure span { display: block; width: 59px; height: 58px; background: url(../images/video.png) center no-repeat; position: absolute; right: 0; margin: auto; top: 0; left: 0; bottom: 0; } .video-list li b { display: block; line-height: 57px; height: 57px; border-bottom: 1px solid #d9d9d9; text-align: center; color: #666666; font-size: 16px; font-weight: normal; position: relative; transition: 320ms; } .video-list li b:before { content: ""; width: 100%; height: 1px; background: #f6792b; position: absolute; left: 0; bottom: -1px; opacity: 0; visibility: hidden; transform: scaleX(0); -webkit-transform: scaleX(0); -moz-transform: scaleX(0); transition: 426ms; transform-origin: left top; -webkit-transform-origin: left top; } .video-list li:hover figure img { transform: scale(1.04); -webkit-transform: scale(1.04); -moz-transform: scale(1.04); } .video-list li:hover b { color: #f6792b; } .video-list li:hover b:before { opacity: 1; visibility: visible; transform: scaleX(1); -webkit-transform: scaleX(1); -moz-transform: scaleX(1); } .vwrap { display: none; z-index: 1040; width: 100%; position: fixed; left: 0; top: 0; } .vwrap .videobtg { z-index: 900; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: #000; opacity: 0.8; filter: alpha(opacity=80); overflow: hidden; } .vwrap .videobox { z-index: 990; width: 860px; height: 480px; background-color: #fff; position: fixed; left: 50%; top: 50%; margin-top: -240px; margin-left: -430px; } .vwrap .videobox #videobox { width: 100%; display: inline-block; height: 100%; background: #80abde; } #videobox_wrapper { height: 100%!important; } .vwrap .close { z-index: 999; width: 24px; height: 24px; cursor: pointer; position: absolute; top: -28px; right: 0px; } .vwrap .close i { display: block; width: 24px; height: 24px; background: url(../images/close.png) no-repeat 50% 50%; -webkit-transition: 400ms; transition: 400ms; } .vwrap .close:hover i { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } #videobox_display_button { background: none no-repeat!important; } .jwplayer .jwicon:hover { opacity: 1; filter: alpha(opacity=100); } .jwlogo, .jwclick { display: none!important; } .personnel-box { background: #fff; } .personner { padding: 88px 0 72px; } .personner-info { width: 18.6%; float: left; margin-right: 8.533333%; } .personner-info b { display: block; width: 31px; height: 31px; position: relative; margin-bottom: 16px; } .personner-info b img { display: block; max-width: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; } .personner-info span { display: block; line-height: 1; color: #666666; font-size: 16px; padding-bottom: 13px; border-bottom: 1px solid #d5d5d5; margin-bottom: 14px; } .personner-info p { color: #666666; font-size: 14px; } .personner-info:nth-child(4n+4) { margin-right: 0; } .person-box { padding: 134px 0 300px; text-align: center; position: relative; } .person { position: relative; } .need { width: 428px; height: 428px; position: relative; text-align: center; margin: auto; } .need img { display: block; width: 100%; height: auto; line-height: 0; } .needwr { width: 100%; text-align: center; height: 160px; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; } .needwr b { display: block; width: 57px; height: 51px; background: url(../images/vested-.png) center no-repeat; margin: auto; margin-bottom: 16px; } .needwr strong { display: block; text-align: center; color: #fff; font-size: 24px; margin-bottom: 10px; } .needwr span { display: block; color: #fff; font-size: 16px; font-family: "Arial"; text-align: center; line-height: 1.4; text-transform: uppercase; } .need-info { position: absolute; width: 428px; } .need-info img { display: block; width: 100%; height: auto; line-height: 1; } .needtext { padding-top: 80px; width: 100%; text-align: center; position: absolute; left: 0; top: 0; } .needtext strong { display: block; text-align: center; line-height: 1; color: #f6792b; font-size: 18px; margin-bottom: 8px; } .needtext b { display: block; text-align: center; line-height: 1; color: #999999; font-size: 14px; margin-bottom: 24px; } .needtext p { text-align: left; color: #666666; font-size: 14px; width: 280px; margin: auto; } .need1 { left: -4px; top: 0; } .need1 .needtext { padding-top: 114px; } .need2 { right: -4px; top: 0; } .need2 .needtext p { width: 254px; } .need3 { left: 211px; top: 215px; } .need4 { right: 211px; top: 215px; } .need4 .needtext p { width: 250px; } .import-box { background: #ffffff; padding-bottom: 114px; border-bottom: 1px solid #cccccc; } .importtop { position: relative; overflow: hidden; } .importtop img { display: block; width: 100%; height: auto; line-height: 1; } .position { position: absolute; right: 28.125%; bottom: 28.6%; padding-bottom: 58px; background: url(../images/start.png) bottom center no-repeat; } .posied strong { display: block; float: left; color: #5c5c5c; font-size: 72px; font-family: "Arial"; line-height: 1; } .poright { float: left; margin-left: 12px; } .poright b { display: block; color: #535353; font-size: 24px; line-height: 1.6; } .poright p { color: #535353; font-size: 14px; font-weight: bold; } .recruite { padding-top: 70px; } .joins { margin-bottom: 44px; } .joins h4 { text-align: center; color: #666666; font-size: 18px; margin-bottom: 8px; } .joins p { text-align: center; color: #666666; font-size: 14px; } .joins p a { display: inline-block; color: #f6792b; } .recuiwr { text-align: center; margin-bottom: 30px; } .recuite-box .staffow { float: none; display: inline-block; margin: auto; } .recruite-fix { } .recuite-title small { text-align: center; color: #c8c8c8; font-size: 20px; font-family: Arial; line-height: normal; display: block; } .recruite-t { padding: 20px 0 16px; background: #999999; } .recruite-t span { color: #fff; display: block; line-height: 1; float: left; font-size: 14px; line-height: normal; } .recruite-t span:nth-child(1) {padding-left: 40px;width: 400px;} .recruite-t span:nth-child(2) { width: 230px; text-align: center; } .recruite-t span:nth-child(3) { width: 230px; text-align: center; } .recruite-t span:nth-child(4) {width: 320px;text-align: center;} .recruite-t span:nth-child(5) { width: 262px; text-align: center; } .recruite-t span:nth-child(6) { width: 66px; } .recuite-info { margin-bottom: 2px; } .recuite-top { cursor: pointer; background: #f7f7f7; transition: 366ms; position: relative; overflow: inherit; } .recuite-info:nth-child(1) .recuites { display: block; } .recuite-top.on, .recuite-top:hover { background: #f6792b; } .recuite-top.on span, .recuite-top:hover span { color: #fff; } .recuite-top.on span:last-child:after, .recuite-top.on span:last-child:before, .recuite-top:hover span:last-child:after, .recuite-top:hover span:last-child:before { background: #fff; } .recuite-top.on span:last-child:after { transform: translateY(50px); -webkit-transform: translateY(50px); -moz-transform: translateY(50px); opacity: 0; visibility: hidden; } .recuite-top span { display: block; float: left; position: relative; color: #666666; font-size: 14px; line-height: 50px; transition: 320ms; } .recuite-top span:nth-child(1) {padding-left: 40px;width: 400px;} .recuite-top span:nth-child(2) { width: 230px; text-align: center; } .recuite-top span:nth-child(3) { width: 230px; text-align: center; } .recuite-top span:nth-child(4) {width: 320px;text-align: center;} .recuite-top span:nth-child(5) { width: 262px; text-align: center; } .recuite-top span:nth-child(6) { width: 66px; } .recuite-top span:last-child { width: 15px; height: 15px; position: absolute; right: 23px; top: 14px; } .recuite-top span:last-child:before { content: ""; width: 15px; height: 3px; background: #cccccc; position: absolute; left: 0; top: 6px; } .recuite-top span:last-child:after { content: ""; width: 3px; height: 15px; background: #cccccc; position: absolute; left: 6px; top: 0; transition: 320ms; } .recuites { padding: 34px 34px 6px; background: #fff; position: relative; border: 1px solid #cccccc; display: none; } .recuite-list { margin-bottom: 32px; } .recuite-list strong { line-height: normal; color: #666666; font-size: 14px; margin-bottom: 10px; } .recuite-list p { color: #666666; font-size: 14px; margin-bottom: 4px; } .recuite-list p a { display: inline-block; color: #f56f26; margin-right: 24px; } .map { height: 640px; } .anchorBL { display: none !important; } .contactmap { padding: 52px 0 135px; background: #fff; } .linemessage { padding: 40px 0 98px; background: #f7f7f7; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; } .linemessage h3 { color: #666666; text-align: center; font-size: 24px; line-height: 1; position: relative; top: -85px; } .message-info { width: 31.72%; margin-right: 2.42%; margin-bottom: 24px; float: left; } .message-info1 { width: 100%; } .message-info:nth-child(3n+3) { margin-right: 0; } .message-info span { display: block; line-height: 1; color: #666666; font-size: 14px; margin-bottom: 10px; padding-left: 3px; float: left; width: 100%; } .messt { padding-left: 6px; width: 400px; background: #fff; border: 1px solid #cccccb; outline: none; padding-top: 0; padding-bottom: 0; color: #666666; line-height: 38px; height: 38px; display: inline-block; float: left; transition: 320ms; } .messt:focus { border-color: #f67326; } .message-info textarea { width: 1274px; height: 106px; border: 1px solid #cccccb; outline: none; background: none; padding: 0; line-height: 1.4; color: #666666; font-family: "微软雅黑"; transition: 300ms; padding-left: 6px; background: #fff; } .message-info textarea:focus { border-color: #f67326; } .tyan { display: inline-block; margin-left: 14px; width: 105px; height: 39px; float: left; } .message-sub { margin-top: 30px; float: left; width: 100%; } .message-sub input { width: 100%; height: 40px; line-height: 40px; color: #ffffff; font-size: 14px; text-align: center; background: #f67326; border: none; outline: none; transition: 334ms; cursor: pointer; font-family: "微软雅黑"; } .message-sub input:hover { opacity: 0.8; } .messagep { margin-top: 22px; width: 100%; float: left; } .messagep p { color: #666666; font-size: 15px; text-align: center; } .bshare-custom { float: left; } .bshare-custom a { height: 20px !important; width: 20px !important; margin-right: 4px; transition: 300ms; float: left; margin-top: 0 !important; margin-bottom: 0 !important; background-position: 0 !important; } .bshare-custom .icon-share1 { background: url(../images/weix2.png) center no-repeat; } .bshare-custom .icon-share2 { background: url(../images/weib.png) center no-repeat; } .bshare-custom .icon-share3 { background: url(../images/qq.png) center no-repeat; } .shareweix { margin-right: 6px; float: left; } .shareweix a { display: block; width: 20px; height: 20px; background: url(../images/weix.png) center no-repeat; } .bshare-custom .icon-share3:hover { background: url(../images/qq1.png) center no-repeat; } .bshare-custom .icon-share1:hover { background: url(../images/weix1.png) center no-repeat; } .bshare-custom .icon-share2:hover { background: url(../images/weib1.png) center no-repeat; } .backtop { width: 40px; height: 40px; background: #f6792b; position: fixed; z-index: 99; right: 30px; bottom: 20px; cursor: pointer; } .backtop span { display: block; width: 12px; height: 6px; background: url(../images/arrow14.png) center no-repeat; position: absolute; left: 50%; margin-left: -6px; top: 50%; margin-top: -3px; transition: 300ms; } .backtop:hover span { transform: translateY(-4px); -webkit-transform: translateY(-4px); -moz-transform: translateY(-4px); } .businessbg { background-size: cover !important; } .micro-info.article-block { opacity: 0; visibility: hidden; position: relative; top: 40px; transition: 388ms 0ms; } .micro-info.articleShow { opacity: 1; visibility: visible; top: 0; } .micro-info.article-block:nth-child(2) { transition: 388ms 140ms; } .micro-info.article-block:nth-child(3) { transition: 388ms 280ms; } .microtext.article-block { opacity: 0; position: relative; top: 60px; transition: 500ms; } .microtext.articleShow { opacity: 1; top: 0; } .lovelife.article-block { opacity: 0; position: relative; top: 40px; transition: 438ms 0ms; } .lovelife.articleShow { opacity: 1; top: 0; } .creatimg.article-block { opacity: 0; position: relative; top: 40px; transition: 438ms 200ms; } .creatimg.articleShow { opacity: 1; top: 0; } .cdynamic.article-block, .personnel.article-block { opacity: 0; transform: translateX(-120px); -webkit-transform: translateX(-120px); -moz-transform: translateX(-120px); transition: 588ms 120ms; } .personnel.article-block { transform: translateX(120px); -webkit-transform: translateX(120px); -moz-transform: translateX(120px); } .cdynamic.articleShow, .personnel.articleShow { opacity: 1; transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); } .aboubox.article-block { opacity: 0; position: relative; top: 56px; transition: 530ms 0ms; } .aboubox.articleShow { opacity: 1; top: 0; } .culture-info.article-block { opacity: 0; visibility: hidden; transform: translateY(40px); -webkit-transform: translateY(40px); -moz-transform: translateY(40px); transition: 488ms 0ms; } .culture-info.articleShow { opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); } .culture-info.article-block:nth-child(2) { transition: 488ms 140ms; } .culture-info.article-block:nth-child(3) { transition: 488ms 280ms; } .commonwealtop.article-block { opacity: 0; visibility: hidden; transform: translateY(55px); -webkit-transform: translateY(55px); -moz-transform: translateY(55px); transition: 422ms 0ms; } .commonwealtop.articleShow { opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); } .commonwealist li.article-block .wealwr { opacity: 0; transform: translateY(60px); -webkit-transform: translateY(60px); -moz-transform: translateY(60px); transition: 528ms; } .commonwealist li.articleShow .wealwr { opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); } .commonwealist li.article-block figure { opacity: 0; transform: translateX(80px); -webkit-transform: translateX(80px); -moz-transform: translateX(80px); transition: 560ms; } .commonwealist li.articleShow figure { opacity: 1; transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); } .phostop.article-block { opacity: 0; transform: translateY(45px); -webkit-transform: translateY(45px); -moz-transform: translateY(45px); transition: 420ms; } .phostop.articleShow { opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); } .finace.article-block li { opacity: 0; transform: translateY(30px); -webkit-transform: translateY(30px); -moz-transform: translateY(30px); transition: 340ms; } .finace.articleShow li { opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); } .finace.article-block li:nth-child(2) { transition: 340ms 160ms; } .finace.article-block li:nth-child(3) { transition: 340ms 320ms; } .personner-info.article-block { opacity: 0; transform: translateY(36px); -webkit-transform: translateY(36px); -moz-transform: translateY(36px); transition: 388ms 0ms; } .personner-info.articleShow { opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); } .personner-info.article-block:nth-child(2) { transition: 388ms 140ms; } .personner-info.article-block:nth-child(3) { transition: 388ms 280ms; } .personner-info.article-block:nth-child(4) { transition: 388ms 420ms; } .need.article-block img, .need-info.article-block img { opacity: 0; transform: scale(0.4) rotate(-180deg); -webkit-transform: scale(0.4) rotate(-180deg); -moz-transform: scale(0.4) rotate(-180deg); transition: 588ms ease-in-out; } .need.articleShow img, .need-info.articleShow img { opacity: 1; transform: scale(1) rotate(0); -webkit-transform: scale(1) rotate(0); -moz-transform: scale(1) rotate(0); } .need.article-block .needwr, .need-info.article-block .needtext { opacity: 0; transition: 388ms 0ms ease-in-out; } .need.articleShow .needwr, .need-info.articleShow .needtext { opacity: 1; transition: 388ms 180ms ease-in-out; } .position.article-block { opacity: 0; transform: scale(0) translateY(30px); -webkit-transform: scale(0) translateY(30px); -moz-transform: scale(0) translateY(30px); transition: 478ms ease-in-out; } .position.articleShow { opacity: 1; transform: scale(1) translateY(0px); -webkit-transform: scale(1) translateY(0px); -moz-transform: scale(1) translateY(0px); } .footer-copy { display: flex; justify-content: space-between; align-items: center; } .footer-copy p { display: inline-block; padding-right: 5px; } .footer-copy p img { /* width: 200px; */ height: 58px; } .videobox video{ display: block; width: 100%; height: auto; }