/*banner*/ .index_banner{ width: 100%; position: relative; } .index_banner .index_bannerin{ width: 100%; position: relative; padding-top: 36.45833333333333%; } .fullSlide{width:100%;position:absolute;height:100%;left: 0;top: 0;} .fullSlide .bd{ position:relative; z-index:0; overflow:hidden; width:100%; height:100%; } .fullSlide .bd ul{ width:100% !important; height:100% !important; } .fullSlide .bd li{ width:100% !important; height:100%; overflow:hidden; background-position: center center; background-repeat: no-repeat; background-size: cover; -webkit-background-size: cover; } .fullSlide .bd li a{ display:block; height:100%; } .fullSlide .bd li a img{ display: block; /*height:100%;*/ width: 100%; } .fullSlide .bd li .bannera_1{ position: absolute; width: auto; height: 67%; left: 0%; bottom: 0%; opacity: 0; filter:alpha(opacity=0); opacity: 1\9; filter:alpha(opacity=100)\9; animation: bannera_1 1s ease-in-out forwards; -o-animation: bannera_1 1s ease-in-out forwards; -moz-animation: bannera_1 1s ease-in-out forwards; -webkit-animation: bannera_1 1s ease-in-out forwards; } @keyframes bannera_1 { from {left: -50px;opacity: 0;filter:alpha(opacity=0);} to {left: 0%;opacity: 1;filter:alpha(opacity=100);} } @-moz-keyframes bannera_1 { from {left: -50px;opacity: 0;filter:alpha(opacity=0);} to {left: 0%;opacity: 1;filter:alpha(opacity=100);} } @-webkit-keyframes bannera_1 { from {left: -50px;opacity: 0;filter:alpha(opacity=0);} to {left: 0%;opacity: 1;filter:alpha(opacity=100);} } @-o-keyframes bannera_1 { from {left: -50px;opacity: 0;filter:alpha(opacity=0);} to {left: 0%;opacity: 1;filter:alpha(opacity=100);} } .fullSlide .bd li .bannera_2{ position: absolute; width: auto; height: 100%; right: 0; top: 0; opacity: 0; filter:alpha(opacity=0); opacity: 1\9; filter:alpha(opacity=100)\9; animation: bannera_2 1s ease-in-out 0.8s forwards; -o-animation: bannera_2 1s ease-in-out 0.8s forwards; -moz-animation: bannera_2 1s ease-in-out 0.8s forwards; -webkit-animation: bannera_2 1s ease-in-out 0.8s forwards; } @keyframes bannera_2 { from {right: -30px;opacity: 0;filter:alpha(opacity=0);} to {right: 0%;opacity: 1;filter:alpha(opacity=100);} } @-moz-keyframes bannera_2 { from {right: -30px;opacity: 0;filter:alpha(opacity=0);} to {right: 0%;opacity: 1;filter:alpha(opacity=100);} } @-webkit-keyframes bannera_2 { from {right: -30px;opacity: 0;filter:alpha(opacity=0);} to {right: 0%;opacity: 1;filter:alpha(opacity=100);} } @-o-keyframes bannera_2 { from {right: -30px;opacity: 0;filter:alpha(opacity=0);} to {right: 0%;opacity: 1;filter:alpha(opacity=100);} } .fullSlide .bd li .bannera_3{ position: absolute; height: 24.7%; width: auto; left: 10%; top: 30%; clip: rect(0px,0px,1000px,0px); clip: rect(0px,2000px,1000px,0px)\9; animation: bannera_3 2s ease 1.5s forwards; -o-animation: bannera_3 2s ease 1.5s forwards; -moz-animation: bannera_3 2s ease 1.5s forwards; -webkit-animation: bannera_3 2s ease 1.5s forwards; } @keyframes bannera_3 { from {clip: rect(0px,0px,1000px,0px);} to {clip: rect(0px,2000px,1000px,0px);} } @-moz-keyframes bannera_3 { from {clip: rect(0px,0px,1000px,0px);} to {clip: rect(0px,2000px,1000px,0px);} } @-webkit-keyframes bannera_3 { from {clip: rect(0px,0px,1000px,0px);} to {clip: rect(0px,2000px,1000px,0px);} } @-o-keyframes bannera_3 { from {clip: rect(0px,0px,1000px,0px);} to {clip: rect(0px,2000px,1000px,0px);} } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .fullSlide .bd li .bannera_1, .fullSlide .bd li .bannera_2, .fullSlide .bd li .bannera_3{ animation: none; -o-animation: none; -moz-animation: none; -webkit-animation: none; opacity: 1; } } .fullSlide .prev, .fullSlide .next{ display:block; position:absolute; z-index:1; top:50%; margin-top:-22px; left:30px; z-index:1; width:44px; height:44px; cursor:pointer; background-color: rgba(0,0,0,0.6); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000,endcolorstr=#99000000); background-image: url(../images/a6.png); background-size: 88px 44px; -webkit-background-size: 88px 44px; background-repeat: no-repeat; background-position: 0 0; } .fullSlide .next{ left:auto; right:30px; background-position: right 0; } .fullSlide .pageState{ display: block; position: absolute; z-index: 1; top: 50%; margin-top: -22px; height: 44px; background-color: rgba(0,0,0,0.6); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000,endcolorstr=#99000000); right: 74px; font-size: 18px; color: #fff; line-height: 44px; padding: 0 10px; letter-spacing: 5px; } .fullSlide .pageState>span{ font-size: 30px; color: #d12519; } @media screen and (max-width: 1199px){ .fullSlide .prev,.fullSlide .next,.fullSlide .pageState{ display: none; } } /*公司新闻*/ .index_one{ width: 90%; margin: 0 auto; position: relative; overflow: hidden; } .index_one:after{ content: ""; display: block; height: 0; clear: both; visibility: hidden; } .index_title{ width: 100%; text-align: center; margin: 8% 0 4% 0; position: relative; } .index_title>h2{ width: 100%; height: 6px; background: url(../images/a7.png) center no-repeat; background-size: 224px 6px; -webkit-background-size: 224px 6px; margin: 10px 0; } .index_title>h1{ font-size: 30px; color: #bd2315; font-weight: normal; position: relative; top: 0; /* -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; transition: all .5s; */ } .index_title>h3{ font-size: 18px; color: #001534; font-weight: normal; text-transform: uppercase; position: relative; top: 0; /* -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; transition: all .5s; */ } .index_title .more_news{ position: absolute; top: 48%; right: 0; color: #bd2315; } .index_title .more_news:hover{ text-decoration: underline; } /* .index_title:hover>h1{ top: 65px; } .index_title:hover>h3{ top: -50px; } */ /*list*/ .index_onelist{ width: 100%; } .index_onelist li{ float: left; width: 32%; margin: 0 0 0 2%; } .index_onelist li.last{ display: none; } .index_onelist li:first-child{ margin: 0; } .index_onelist li a{display: block;} .index_onelist li div.img{ width: 100%; padding-top: 57.647%; position: relative; overflow: hidden; background: #001534; } .index_onelist li div.img:after{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.3); content: ''; -webkit-transition: all .6s ease-in-out 0s; -moz-transition: all .6s ease-in-out 0s; -ms-transition: all .6s ease-in-out 0s; -o-transition: all .6s ease-in-out 0s; transition: all .6s ease-in-out 0s; -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-110%,0); transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-110%,0); opacity: 0.5; } .index_onelist li:hover div.img:after{ -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,110%,0); transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,110%,0); opacity: 1; } .index_onelist li div.img img{ display: block; width: 102%; height: 102%; position: absolute; left: -1%; top: -1%; -webkit-transition: all 1s ease-in-out 0s; -moz-transition: all 1s ease-in-out 0s; -ms-transition: all 1s ease-in-out 0s; -o-transition: all 1s ease-in-out 0s; transition: all 1s ease-in-out 0s; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; filter:alpha(opacity=100); } .index_onelist li:hover div.img img{ -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); opacity: 0.6; filter:alpha(opacity=60); } .index_onelist li div.word{ width: 100%; position: relative; overflow: hidden; padding: 5% 0; } .index_onelist li div.word span{ display: block; width: 100%; font-size: 14px; line-height: 1.5em; height: 1.5em; overflow: hidden; } .index_onelist li div.word h1{ font-size: 16px; color: #001534; font-weight: normal; width: 100%; line-height: 1.5em; height: 1.5em; overflow: hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; margin: 0.5em 0; -webkit-transition: all .4s ease-in-out 0s; -moz-transition: all .4s ease-in-out 0s; -ms-transition: all .4s ease-in-out 0s; -o-transition: all .4s ease-in-out 0s; transition: all .4s ease-in-out 0s; } .index_onelist li:hover div.word h1{ color: #d12519; } .index_onelist li div.word h1:hover{ text-decoration: underline; } .index_onelist li div.word p{ font-size: 14px; color: #666666; line-height: 1.5em; width: 100%; height: 4.5em; overflow: hidden; text-overflow: ellipsis; -o-text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin: 0 0 0.5em 0; } .index_onelist li div.word em{ font-size: 14px; color: #d12519; font-style: normal; display: block; width: 100%; line-height: 1.5em; height: 1.5em; overflow: hidden; } .index_onelist li div.word em:hover{ text-decoration: underline; } /*ipad*/ @media screen and (max-width: 769px){ .index_one{ width: 96%; } .index_title>h1{ font-size: 20px; } .index_title>h3{ font-size: 16px; } .index_title:hover>h1{ top: 50px; } .index_title:hover>h3{ top: -45px; } .index_onelist li{ width: 49%; margin: 0 0 2% 2%; } .index_onelist li.last{ display: block; } .index_onelist li:nth-child(odd){ margin: 0; } .index_onelist li div.word p{ display: none; } .index_onelist li div.word em{ font-size: 12px; } .index_onelist li div.word span{ font-size: 12px; } .index_onelist li div.word h1{ font-size: 14px; } } /*全球分布+股票图示*/ .index_two{ width: 100%; position: relative; padding: 5% 0 0 0; } .index_two .index_twol{ float: left; width: 50%; padding-top: 26.5625%; position: relative; overflow: hidden; } .index_two .index_twol>img{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .index_two .index_twor{ float: left; width: 50%; padding-top: 26.5625%; position: relative; overflow: hidden; } .index_two .index_twor>img{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .index_two .index_twor .index_tworin{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 5; padding: 5%; font-size: 20px; } .index_two .index_twor .index_tworin>h1{ font-size: inherit; width: 100%; padding: 0 0 3% 2.5em; position: relative; color: #fff; font-weight: normal; border-bottom: 1px solid #b87d7a; } .index_two .index_twor .index_tworin>h1:after{ content: ""; display: block; height: 0; clear: both; visibility: hidden; } .index_two .index_twor .index_tworin>h1 i{ position: absolute; width: 1.6em; height: 1.3em; background: url(../images/a8.png) center no-repeat; background-size: 100% 100%; -webkit-background-size: 100% 100%; left: 0; top: 35%; margin-top: -0.65em; } .index_two .index_twor .index_tworin>h1 span{ font-size: 1.5em; } .index_two .index_twor .index_tworin>h1 em{ font-size: 1em; font-style: normal; text-transform: uppercase; margin: 0 0 0 3%; } .index_two .index_twor .index_tworin>h2{ font-size: inherit; font-weight: normal; color: #fff; width: 100%; position: relative; padding: 0 0 0 1.5em; margin: 6% 0 0 0; } .index_two .index_twor .index_tworin>h2:after{ content: ""; display: block; height: 0; clear: both; visibility: hidden; } .index_two .index_twor .index_tworin>h2 i{ display: block; position: absolute; left: 0; top: 50%; width: 1.2em; height: 1.45em; background: url(../images/a9.png) center no-repeat; background-size: 100% 100%; -webkit-background-size: 100% 100%; } .index_two .index_twor .index_tworin>h2 span{ font-size: 5em; display: inline-block; width: 50%; } .index_two .index_twor .index_tworin>h2 div{ font-size: 20px; color: #b9baba; display: inline-block; width: 50%; padding: 0 0 0 2em; position: relative; } .index_two .index_twor .index_tworin>h2 div b{ position: absolute; display: block; width: 1.3em; height: 1.9em; background-size: 100% 100%; -webkit-background-size: 100% 100%; left: 0; top: 50%; margin-top: -0.95em; } .index_two .index_twor .index_tworin>h2 div b.up{ background: url(../images/a10.png) center no-repeat; background-size: 100% 100%; -webkit-background-size: 100% 100%; } .index_two .index_twor .index_tworin>h2 div b.down{ background: url(../images/a10_1.png) center no-repeat; background-size: 100% 100%; -webkit-background-size: 100% 100%; } .index_two .index_twor .index_tworin>h2 div em{ font-size: 2.1em; font-style: normal; } .index_two .index_twor .index_tworin>h3{ font-size: inherit; font-weight: normal; color: #b9baba; width: 100%; position: relative; padding: 0 0 0 1.5em; } .index_two .index_twor .index_tworin>h3:after{ content: ""; display: block; height: 0; clear: both; visibility: hidden; } .index_two .index_twor .index_tworin>h3 span{ font-size: 1.6em; display: inline-block; width: 50%; } .index_two .index_twor .index_tworin>h3 div{ font-size: 20px; color: #b9baba; display: inline-block; width: 50%; padding: 0 0 0 2em; position: relative; } .index_two .index_twor .index_tworin>h3 div b{ position: absolute; display: block; width: 0.85em; height: 1.3em; background: url(../images/a11.png) center no-repeat; background-size: 100% 100%; -webkit-background-size: 100% 100%; left: 0.2em; top: 50%; margin-top: -0.65em; } .index_two .index_twor .index_tworin>h3 div em{ font-size: 1.6em; font-style: normal; } .index_two .index_twor .index_tworin>h4{ width: 100%; position: absolute; left: 0; bottom: 0; height: 12%; display: table; font-size: inherit; overflow: hidden; table-layout: fixed; } .index_two .index_twor .index_tworin>h4 span,.index_two .index_twor .index_tworin>h4 em{ display: table-cell; text-align: right; vertical-align: middle; color: #b9baba; font-weight: normal; font-style: normal; font-size: 0.7em; text-transform: uppercase; padding: 0 10%; } /*pc*/ @media screen and (min-width: 1500px) and (max-width: 1650px){ .index_two .index_twor .index_tworin,.index_two .index_twor .index_tworin>h2 div,.index_two .index_twor .index_tworin>h3 div{ font-size: 17px; } } @media screen and (min-width: 1300px) and (max-width: 1499px){ .index_two .index_twor .index_tworin,.index_two .index_twor .index_tworin>h2 div,.index_two .index_twor .index_tworin>h3 div{ font-size: 15px; } } @media screen and (min-width: 1100px) and (max-width: 1299px){ .index_two .index_twor .index_tworin,.index_two .index_twor .index_tworin>h2 div,.index_two .index_twor .index_tworin>h3 div{ font-size: 13px; } .index_two .index_twor .index_tworin{ padding: 3%; } .index_two .index_twor .index_tworin>h4 em{ width: 70%; } } @media screen and (min-width: 950px) and (max-width: 1099px){ .index_two .index_twor .index_tworin,.index_two .index_twor .index_tworin>h2 div,.index_two .index_twor .index_tworin>h3 div{ font-size: 12px; } .index_two .index_twor .index_tworin{ padding: 3%; } .index_two .index_twor .index_tworin>h4 em{ width: 70%; } } @media screen and (min-width: 769px) and (max-width: 949px){ .index_two .index_twor .index_tworin,.index_two .index_twor .index_tworin>h2 div,.index_two .index_twor .index_tworin>h3 div{ font-size: 12px; } .index_two .index_twor .index_tworin{ padding: 3%; } .index_two .index_twor .index_tworin>h4 em{ width: 70%; } .index_two .index_twor .index_tworin>h2{ margin: 6% 0 2% 0; } .index_two .index_twor .index_tworin>h2 span{ font-size: 3em; } .index_two .index_twor .index_tworin>h2 div em{ font-size: 1.5em; } .index_two .index_twor .index_tworin>h3 div em,.index_two .index_twor .index_tworin>h3 span{ font-size: 1.2em; } } /*ipad*/ @media screen and (max-width: 768px){ .index_two .index_twol,.index_two .index_twor{ width: 100%; float: none; padding-top: 53.125%; } .index_two .index_twor .index_tworin,.index_two .index_twor .index_tworin>h2 div,.index_two .index_twor .index_tworin>h3 div{ font-size: 15px; } .index_two .index_twor .index_tworin>h2{ margin: 8% 0 0 0; } } /*行业动态*/ .index_three{ width: 90%; margin: 0 auto; position: relative; overflow: hidden; } .index_threelist{ width: 100%; } .index_threelist li{ float: left; width: 32%; margin: 0 0 0 2%; } .index_threelist li.last{ display: none; } .index_threelist li:first-child{ margin: 0; } .index_threelist li a{display: block;} .index_threelist li div.img{ width: 100%; padding-top: 57.647%; position: relative; overflow: hidden; } .index_threelist li div.img:before{ content: ""; display: block; width: 100%; height: 0; background: rgba(0,0,0,0.4); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#99000000,endcolorstr=#99000000); position: absolute; left: 0; bottom: 0; z-index: 5; opacity: 0; filter:alpha(opacity=0); -webkit-transition: all .8s ease-in-out 0s; -moz-transition: all .8s ease-in-out 0s; -ms-transition: all .8s ease-in-out 0s; -o-transition: all .8s ease-in-out 0s; transition: all .8s ease-in-out 0s; box-shadow: 0 0 10px rgba(0,0,0,0.4) } .index_threelist li div.img img{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .index_threelist li div.word{ width: 90%; background: #f7f7f8; position: relative; margin: -12% auto 0 auto; padding: 5%; z-index: 6; -webkit-transition: all 0.8s ease-in-out 0.2s; -moz-transition: all 0.8s ease-in-out 0.2s; -ms-transition: all 0.8s ease-in-out 0.2s; -o-transition: all 0.8s ease-in-out 0.2s; transition: all 0.8s ease-in-out 0.2s; } .index_threelist li div.word:before{ content: ""; display: block; border: 1px solid #d9d9d9; position: absolute; left: 7px; top: 7px; right: 7px; bottom: 7px; } .index_threelist li div.word h1{ font-size: 16px; color: #333333; font-weight: normal; width: 100%; line-height: 1.5em; height: 2.5em; overflow: hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; text-align: center; padding: 0 0 1em 0; margin: 0 0 1em 0; position: relative; -webkit-transition: all .3s ease-in-out 0s; -moz-transition: all .3s ease-in-out 0s; -ms-transition: all .3s ease-in-out 0s; -o-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; } .index_threelist li div.word h1:before{ content: ""; width: 40px; height: 1px; background: #d5d5d6; position: absolute; left: 50%; bottom: 0; margin: 0 0 0 -20px; } .index_threelist li div.word p{ font-size: 14px; color: #666; text-align: center; width: 100%; line-height: 1.5em; height: 4.5em; overflow: hidden; text-overflow: ellipsis; -o-text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin: 0 0 3% 0; } .index_threelist li div.word em{ display: block; font-style: normal; text-transform: uppercase; text-align: center; position: relative; font-size: 12px; color: #666666; line-height: 1.5em; -webkit-transition: all .3s ease-in-out 0s; -moz-transition: all .3s ease-in-out 0s; -ms-transition: all .3s ease-in-out 0s; -o-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; } .index_threelist li div.word em:after{ content: ">"; font-size: 12px; color: #fff; width: 16px; height: 16px; line-height: 16px; background: #c5c5c5; display: inline-block; font-family: 'SimHei'; margin: 0 0 0 5%; -webkit-transition: all .3s ease-in-out 0s; -moz-transition: all .3s ease-in-out 0s; -ms-transition: all .3s ease-in-out 0s; -o-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; text-align: center; } .index_threelist li:hover div.word{ margin: -25% auto 0 auto; } .index_threelist li:hover div.word em{ color: #bd2315; } .index_threelist li:hover div.word em:after{ background: #bd2315; } .index_threelist li:hover div.word h1{ color: #e71608; } .index_threelist li:hover div.img:before{ height: 100%; opacity: 1; filter:alpha(opacity=100); } /*ipad*/ @media screen and (max-width: 769px){ .index_three{ width: 96%; } .index_threelist li{ width: 49%; margin: 0 0 2% 2%; } .index_threelist li:nth-child(odd){ margin: 0; } .index_threelist li.last{ display: block; } .index_threelist li div.word{ padding: 7%; } .index_threelist li:hover div.word{ margin: -12% auto 0 auto; } .index_threelist li div.word h1{ font-size: 14px; padding: 0 0 0.5em 0; margin: 0 0 0.5em 0; height: 2em; } .index_threelist li div.word p{ font-size: 12px; height: 1.5em; -webkit-line-clamp: 1; } } /*友情链接*/ .index_four{ padding: 2% 50px; background: #e2e2e2; margin: 5% 0 0 0; position: relative; } .picScroll-left{ width: 100%; overflow:hidden; position:relative; padding: 0 50px; } .picScroll-left .hd .prev,.picScroll-left .hd .next{ display: block; width: 44px; height: 44px; background-color: #6e6e6e; background-image: url(../images/a6.png); background-repeat: no-repeat; background-size: 88px 44px; -webkit-background-size: 88px 44px; position: absolute; left: 0; top: 50%; margin-top: -22px; -webkit-transition: all .3s ease-in-out 0s; -moz-transition: all .3s ease-in-out 0s; -ms-transition: all .3s ease-in-out 0s; -o-transition: all .3s ease-in-out 0s; transition: all .3s ease-in-out 0s; } .picScroll-left .hd .next{ background-position: right center; left: auto; right: 0; } .picScroll-left .hd .prev:hover,.picScroll-left .hd .next:hover{ background-color: #bd2315; } .picScroll-left .bd{ margin: 0 auto; overflow: hidden; } .picScroll-left .bd .tempWrap{ margin: 0 auto; } .picScroll-left .bd ul{ overflow:hidden; zoom:1; text-align: center; } .picScroll-left .bd ul li{ margin:0 8px; _display:inline; display: inline-block; overflow:hidden; width: 170px; height: 130px; } .picScroll-left .bd ul li div{ display: table; width: inherit; height: inherit; table-layout: fixed; position: relative; overflow: hidden; } .picScroll-left .bd ul li div a{ display: table-cell; text-align: center; vertical-align: middle; width: inherit; height: inherit; } .picScroll-left .bd ul li div a img{ display: block; margin: 0 auto; max-width: 170px; max-height: 130px; }