You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
499 lines
18 KiB
499 lines
18 KiB
@charset "utf-8"; |
|
|
|
/* font */ |
|
|
|
|
|
@font-face { |
|
font-family: "Segoe UI Light"; |
|
src: url("../fonts/segoeuil.eot"); /* IE9 Compat Modes */ |
|
src:local("Segoe UI Light"), |
|
url("../fonts/segoeuil.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ |
|
url("../fonts/segoeuil.woff") format("woff"), /* Modern Browsers */ |
|
url("../fonts/segoeuil.ttf") format("truetype"), /* Safari, Android, iOS */ |
|
url("../fonts/segoeuil.svg#LandyThanks") format("svg"); /* Legacy iOS */ |
|
font-weight:normal; |
|
font-style:normal; |
|
} |
|
|
|
|
|
|
|
|
|
/* reset */ |
|
* {padding:0;margin:0;-webkit-text-size-adjust:none;} |
|
img {border:0} |
|
|
|
select,input {font-family:"Microsoft YaHei", "微软雅黑", Tahoma, Verdana, Arial; font-size:12px;} |
|
ul,ol {display:block;list-style:none;} |
|
h1,h2,h3,h4,h5,h6 {display:block;} |
|
p {display:block;} |
|
a {text-decoration:none;} |
|
a:hover {text-decoration:none;} |
|
em {font-style:normal;} |
|
|
|
button {font-family:"Microsoft YaHei", "微软雅黑", Tahoma, Verdana, Arial; font-weight:normal;} |
|
|
|
:focus {outline: 0;} |
|
|
|
.clearfix {zoom:1} |
|
.clearfix:after { |
|
content: "."; |
|
display: block; |
|
clear: both; |
|
visibility: hidden; |
|
line-height: 0; |
|
height: 0; |
|
} |
|
|
|
.clear {clear:both;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
/* header body {background:url("../images/common/bg.gif") repeat-x 0 100px;} |
|
|
|
header {width:100%; height:100px; background:url("../images/common/header_pc_bg.gif") repeat-x 0 0 #fff; box-shadow:0px 2px 4px #777; z-index:100;position:relative;} |
|
* */ |
|
|
|
|
|
#gnb_mobile {display:none;} |
|
#gnb_pc {display:block; width:960px; height:100px; margin:0 auto; } |
|
#gnb_pc h1 {float:left; text-indent:-9999px;width:123px; height:100px; background:url("../images/common/header_pc_logo.jpg") no-repeat 0 0; margin:0 33px 0 0;} |
|
#gnb_pc h1 a {width:123px;height:100px; display:block;} |
|
#gnb_pc ul {float:left; width:793px; height:100px; background:url("../images/common/header_pc_gnb.gif") no-repeat 0 0;} |
|
#gnb_pc ul li {float:left; text-align:left; margin:0 0 0 39px;height:100px; } |
|
#gnb_pc ul li a {display:block; line-height:100px; font-size:14px; color:#000;} |
|
|
|
#gnb_pc_submenu {display:block; position:absolute; top:100px; width:100%; height:59px; background:url("../images/common/header_gnb_submenu_bg.gif") repeat-x 0 0 #efefef;overflow:hidden; height:0px;box-shadow:0px 2px 4px #777;} |
|
#gnb_pc_submenu article {width:960px; height:59px; margin:0 auto;} |
|
#gnb_pc_submenu table {height:59px; border:0; border-collapse:collapse;} |
|
#gnb_pc_submenu table td {border-left: solid 1px #e0e0e0; border-right:solid 1px #e0e0e0;} |
|
#gnb_pc_submenu table td a {display:block; height:59px; padding:0px 27px; font-size:14px; color:#000; text-shadow:0px 2px 1px #fff; line-height:59px;} |
|
#gnb_pc_submenu table td a:hover {background:url("../images/common/header_gnb_submenu_item_bg") repeat-x 0 0 #ebebeb;} |
|
|
|
#gnb_pc_submenu1 {margin:0 0 0 150px;} |
|
#gnb_pc_submenu2 {margin:0 0 0 300px;} |
|
#gnb_pc_submenu3 {margin:0 0 0 300px;} |
|
#gnb_pc_submenu4 {margin:0 0 0 200px;} |
|
#gnb_pc_submenu5 {margin:0 0 0 550px;} |
|
#gnb_pc_submenu6 {margin:0 0 0 550px;} |
|
#gnb_pc_submenu7 {margin:0 0 0 380px;} |
|
|
|
#gnb_mobile_submenu {display:none;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* footer */ |
|
|
|
footer {height:382px; width:100%; background:url("../images/common/footer_bg.gif") repeat-x 0 0 #fff; margin:0;} |
|
footer article {width:960px; height:100%; margin:0 auto; background:url("../images/common/footer_line.gif") repeat-x 0 0 #fff; overflow:hidden;} |
|
footer article dl {float:left; width:137px; display:block;} |
|
footer article dl dt {padding:11px 0 0 0; color:#666; font-size:14px;} |
|
footer article dl dt a {color:#666; font-size:14px; width: auto; height:auto; line-height:62px; text-align:left; margin:0; background:none;text-indent:8px;display:block;} |
|
footer article dl dd {display:block;} |
|
footer article dl dd li {line-height:25px;padding:0 0 0 8px; display:block;background:url("../images/common/footer_dot.gif") no-repeat 0px center;} |
|
footer article dl dd a {line-height:25px; font-size:12px; color:#b0b0b0;} |
|
footer article dl dd a:hover {color:#666;} |
|
|
|
footer p {clear:both; text-align:center; font-size:10px; color:#7a7a7a; margin:30px 0 0 0; line-height:20px;} |
|
footer ol {clear:both; display:block; margin:40px auto 20px auto; width:300px;} |
|
footer ol a {color:#000;} |
|
footer ol li#footer_weibo {height:22px; float:left; width:120px; background:url("../images/common/sina.png") no-repeat 0 0 #fff;padding:0 0 0 30px; line-height:22px; font-size:12px;} |
|
footer ol li#footer_wechat {height:22px; float:left; width:120px; background:url("../images/common/wechat.png") no-repeat 0 0 #fff;padding:0 0 0 30px; line-height:22px; font-size:12px;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
/* animation */ |
|
@-webkit-keyframes kv_ani1 |
|
{ |
|
0% {-webkit-transform: translate(-300px,0px); opacity:0;} |
|
100% {-webkit-transform: translate(0px,0px); opacity:1;} |
|
} |
|
|
|
@-webkit-keyframes kv_ani2 |
|
{ |
|
0% {-webkit-transform: translate(300px,0px);opacity:0;} |
|
100% {-webkit-transform: translate(0px,0px); opacity:1;} |
|
} |
|
|
|
@-webkit-keyframes kv_ani3 |
|
{ |
|
0% { opacity:0;} |
|
100% {opacity:1;} |
|
} |
|
|
|
|
|
|
|
@-ms-keyframes kv_ani1 |
|
{ |
|
0% {-ms-transform: translate(-300px,0px); opacity:0;} |
|
100% {-ms-transform: translate(0px,0px); opacity:1;} |
|
} |
|
|
|
@-ms-keyframes kv_ani2 |
|
{ |
|
0% {-ms-transform: translate(300px,0px);opacity:0;} |
|
100% {-ms-transform: translate(0px,0px); opacity:1;} |
|
} |
|
|
|
@-ms-keyframes kv_ani3 |
|
{ |
|
0% { opacity:0;} |
|
100% {opacity:1;} |
|
} |
|
|
|
|
|
|
|
@keyframes kv_ani1 |
|
{ |
|
0% {transform: translate(-300px,0px); opacity:0;} |
|
100% {transform: translate(0px,0px); opacity:1;} |
|
} |
|
|
|
@keyframes kv_ani2 |
|
{ |
|
0% {transform: translate(300px,0px);opacity:0;} |
|
100% {transform: translate(0px,0px); opacity:1;} |
|
} |
|
|
|
@keyframes kv_ani3 |
|
{ |
|
0% { opacity:0;} |
|
100% {opacity:1;} |
|
} |
|
|
|
|
|
|
|
@keyframes main_aniwheel |
|
{ |
|
0% {transform: rotate(0deg);} |
|
100% {transform: rotate(360deg);} |
|
} |
|
|
|
@-ms-keyframes main_aniwheel |
|
{ |
|
0% {-ms-transform: rotate(0deg);} |
|
100% {-ms-transform: rotate(360deg);} |
|
} |
|
|
|
@-webkit-keyframes main_aniwheel |
|
{ |
|
0% {-webkit-transform: rotate(0deg);} |
|
100% {-webkit-transform: rotate(360deg);} |
|
} |
|
|
|
|
|
@keyframes main_anilogo |
|
{ |
|
0% {transform: scale(0.8);} |
|
50% {transform: scale(1.0);} |
|
100% {transform: scale(0.8);} |
|
} |
|
|
|
@-ms-keyframes main_anilogo |
|
{ |
|
0% {-ms-transform: scale(0.8);} |
|
50% {-ms-transform: scale(1.0);} |
|
100% {-ms-transform: scale(0.8);} |
|
} |
|
|
|
@-webkit-keyframes main_anilogo |
|
{ |
|
0% {-webkit-transform: scale(0.8);} |
|
50% {-webkit-transform: scale(1.0);} |
|
100% {-webkit-transform: scale(0.8);} |
|
} |
|
|
|
/* - mouse wheel - */ |
|
|
|
@keyframes mousewheel_ani |
|
{ |
|
0% {opacity:0;} |
|
50% {opacity:1;} |
|
100% {opacity:0;} |
|
} |
|
|
|
@-webkit-keyframes mousewheel_ani |
|
{ |
|
0% {opacity:0;} |
|
50% {opacity:1;} |
|
100% {opacity:0;} |
|
} |
|
|
|
@-ms-keyframes mousewheel_ani |
|
{ |
|
0% {opacity:0;} |
|
50% {opacity:1;} |
|
100% {opacity:0;} |
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
/* main */ |
|
|
|
|
|
html,body {width:100%; overflow-x:hidden;} |
|
#main_content {width:960px;margin:0 auto; padding:0 0 100px 0;} |
|
|
|
.kv_index_main {width:100%; height:535px;background-size:auto 535px; -webkit-animation: kv_ani3 2s ease; -ms-animation: kv_ani3 2s ease; animation:kv_ani3 2s ease; overflow:hidden;} |
|
.kv_index_main strong {line-height:94px; font-weight:normal; width:100%; text-align:center; font-size:72px;padding:190px 0 0 0; color:#000; display:block; -webkit-animation: kv_ani1 2s ease; -ms-animation: kv_ani1 2s ease; animation:kv_ani1 2s ease;} |
|
.kv_index_main em {line-height:62px; font-weight:normal; width:100%; text-align:center; font-size:60px;color:#000; display:block; font-family: "Segoe UI Light"; -webkit-animation: kv_ani2 2s ease; -ms-animation: kv_ani2 2s ease; animation:kv_ani2 2s ease;} |
|
|
|
#kv_index_main1 { background:url("../images/main/kv_main1.jpg") no-repeat top center; } |
|
#kv_index_main2 { background:url("../images/main/kv_main2.jpg") no-repeat top center; } |
|
#kv_index_main3 { background:url("../images/main/kv_main3.jpg") no-repeat top center; } |
|
#kv_index_main4 { background:url("../images/main/kv_main4.jpg") no-repeat top center; } |
|
#kv_index_main5 { background:url("../images/main/kv_main5.jpg") no-repeat top center; } |
|
#kv_index_main6 { background:url("../images/main/kv_main6.jpg") no-repeat top center; } |
|
#kv_index_main7 { background:url("../images/main/kv_main7.jpg") no-repeat top center; } |
|
#kv_index_main8 { background:url("../images/main/kv_main8.jpg") no-repeat top center; } |
|
#kv_index_main9 { background:url("../images/main/kv_main9.jpg") no-repeat top center; } |
|
|
|
#kv_index_main2 strong {display:none;} |
|
#kv_index_main2 em {display:none;} |
|
#kv_index_main3 strong {display:none;} |
|
#kv_index_main3 em {display:none;} |
|
|
|
#main_icon {width:960px;} |
|
|
|
#main_icon li {float:left; width:320px; height:470px; overflow:hidden;} |
|
#main_icon li h2 {height:311px; font-size:30px; text-align:center; line-height:560px; font-weight:normal; text-indent:0;} |
|
#main_icon li h2 a {width:320px; height:311px; display:block;} |
|
#main_icon li p {display:block;font-size:14px; line-height:30px; color:#000; padding:0 16px 0 16px; text-indent:2em;} |
|
|
|
#main_icon_section1 {background:url("../images/main/main_icon1.gif") no-repeat top center;} |
|
#main_icon_section1 h2 a, #main_icon_section1 h2 a:hover {color:#784acb;} |
|
|
|
#main_icon_section2 {background:url("../images/main/main_icon2.gif") no-repeat top center;} |
|
#main_icon_section2 h2 a, #main_icon_section2 h2 a:hover {color:#00c3ce;} |
|
|
|
#main_icon_section3 {background:url("../images/main/main_icon3.gif") no-repeat top center;} |
|
#main_icon_section3 h2 a, #main_icon_section3 h2 a:hover {color:#00a8ce;} |
|
|
|
.main_desc {width:320px; float:left; height:369px;} |
|
.main_desc li {padding:0 16px 0 16px; margin:0 0 15px 0;} |
|
.main_desc li a {font-size:14px; line-height:25px; color:#666; } |
|
.main_desc li a:hover {color:#000;} |
|
|
|
#main_desc1 {list-style-image:url("../images/main/main_list_dot1.gif"); list-style-position:inside; list-style-type: square;} |
|
#main_desc2 {list-style-image:url("../images/main/main_list_dot2.gif"); list-style-position:inside; list-style-type: square;} |
|
#main_desc3 {list-style-image:url("../images/main/main_list_dot3.gif"); list-style-position:inside; list-style-type: square;} |
|
|
|
|
|
#main_case {clear:both; margin:50px 0 50px 0; background:none;} |
|
#main_case h2 {font-size:30px; line-height:60px; color:#666; font-weight:normal; text-align:center;} |
|
#main_case p {font-size:14px; color:#666; text-align:center; display:block; padding:0 0 30px 0; line-height:20px;} |
|
|
|
#main_case dl {width:311px; height:311px; float:left; overflow:hidden; position:relative; margin:0 12px 12px 0; box-shadow:0px 0px 6px #999; left:0;} |
|
#main_case dd img {width:311px; height:311px;position:relative;top:-30px;} |
|
#main_case dt {display:block; width:311px; height:60px; line-height:60px; text-align:center; position:absolute; left:0; bottom:0; background-color:#7f7f7f; color:#fff; font-size:18px;} |
|
#main_case dt a {color:#fff;} |
|
|
|
#main_case dl.last {margin-right:0 !important;} |
|
#main_case dl.last_mobile {margin-right:12px;} |
|
#main_case dl.hide {display:block;} |
|
|
|
#main_mousewheel {z-index:9999;position:absolute; left:50%; margin-left:-35px; bottom:60px; -webkit-animation: mousewheel_ani 2s linear infinite; -ms-animation: mousewheel_ani 2s linear infinite; animation:mousewheel_ani 2s linear infinite;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* animation area - desktop version */ |
|
|
|
#main_sections {} |
|
|
|
#main_section1 {width:100%; height:786px; background:url("../images/main/section1_bg.gif") no-repeat center top; overflow:hidden;} |
|
#main_section2 {width:100%; height:567px; background:url("../images/main/section2_bg.png") no-repeat center top; overflow:hidden;transform-origin:0 0;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;} |
|
#main_section3 {width:100%; height:769px; background:url("../images/main/section3_bg.jpg") no-repeat center top; margin:0px 0 0 0;} |
|
#main_section4 {width:100%; height:506px; background:url("../images/main/section4_bg.png") no-repeat center top; overflow:hidden;} |
|
#main_section5 {width:100%; height:1208px; background:url("../images/main/section5_bg.jpg") no-repeat center top; overflow:hidden;} |
|
#main_section6 {width:100%; height:500px; background:url("../images/main/section6_bg.jpg") no-repeat center top; overflow:hidden;} |
|
|
|
#main_section1 section {width:960px; margin:0 auto; height:100%;position:relative;} |
|
#main_section2 section {width:960px; margin:0 auto; height:100%;} |
|
#main_section3 section {width:960px; margin:0 auto; height:100%;position:relative;} |
|
#main_section4 section {width:960px; margin:0 auto; height:100%;} |
|
#main_section5 section {width:960px; margin:0 auto; height:100%;position:relative;} |
|
#main_section6 section {width:960px; margin:0 auto; height:100%;} |
|
|
|
|
|
|
|
|
|
|
|
/* section 1 */ |
|
|
|
#main_section1 div {width:960px; height:128px; padding:29px 0 0 0;z-index:9999;} |
|
#main_section1 div h2 {color:#000; font-weight:normal; font-size:50px; line-height:72px;text-align:right;} |
|
#main_section1 div h3 {color:#000; font-weight:normal; font-size:28px; line-height:36px;text-align:right; font-weight:normal;} |
|
#main_section1 div img {margin:0 0 0 21px;} |
|
|
|
#main_section1 h4 {font-size:30px;color:#000;} |
|
#main_section1 h4 span {font-size:16px; color:#000; display:block; line-height:25px;} |
|
#main_section1 p {font-size:14px; color:#000; line-height:24px; font-weight:bold;} |
|
|
|
#main_section1_control1 {position:absolute;top:133px;left:0;} |
|
#main_section1_control2 {position:absolute;top:189px;left:357px;text-align:left;} |
|
#main_section1_control3 {position:absolute;top:298px;left:357px;text-align:left;} |
|
#main_section1_control4 {position:absolute;top:387px;right:0;} |
|
#main_section1_control5 {position:absolute;top:441px;left:0;text-align:right; width:600px;} |
|
#main_section1_control6 {position:absolute;top:573px;left:0;text-align:right; width:600px;} |
|
|
|
|
|
|
|
/* section 2 */ |
|
|
|
#main_section2 p {padding:200px 70px 0 70px; color:#fff; font-size:48px; line-height:65px; text-align:center;} |
|
|
|
/* section 3 */ |
|
|
|
#main_section3 h3 {position:relative;padding:44px 0 0 0; font-size:30px; line-height:40px; text-align:center;font-weight:normal;z-index:150; color:#000; transform-origin:center center;-webkit-transform-origin:center center;-ms-transform-origin:center center;} |
|
#main_section3 div#main_section3_chart {width:960px; height:769px; overflow:hidden;position:absolute; top:0; left:0; z-index:100; background:url("../images/main/section3_chart.jpg") no-repeat top center;} |
|
|
|
#main_section3 div#main_section3_bar {position:absolute; bottom:300px; left: 158px; z-index:200; width:644px; } |
|
|
|
#main_section3_bar1 {width: 644px; height:70px; line-height:70px; overflow:hidden; background:url("../images/main/section3_bar1.png") no-repeat 0 0; z-index:200;} |
|
#main_section3_bar1 span {display:block; width:435px; height:70px; font-size:18px; color:#fff; text-align:center; float:left; margin:0 0 0 70px;} |
|
#main_section3_bar1 em {font-size:30px; display:block; width:69px; height:70px; float:left; color:#fff;} |
|
|
|
#main_section3_bar2 {width: 644px; height:70px; line-height:70px; overflow:hidden; background:url("../images/main/section3_bar2.png") no-repeat 0 0; z-index:200;} |
|
#main_section3_bar2 span {display:block; width:435px; height:70px; font-size:18px; color:#fff; text-align:center; float:right; margin:0 70px 0 0;} |
|
#main_section3_bar2 em {font-size:30px; display:block; width:69px; height:70px; float:right; color:#fff; } |
|
|
|
/* section 4 */ |
|
|
|
#main_section4 section {padding:90px 0 0 0; transform-origin:top center;-webkit-transform-origin:top center;-ms-transform-origin:top center;} |
|
#main_section4 section h3 {text-align:center; font-weight:normal; color:#fff; font-size:35px; line-height:85px;} |
|
#main_section4 section h4 {text-align:center; font-weight:normal;color:#fff; font-size:48px; line-height:65px;} |
|
|
|
/* section 5 */ |
|
|
|
#section5_logo1 {position:absolute;top:163px;left:490px; transform-origin:center center;-webkit-animation: main_anilogo 3s linear infinite; -ms-animation: main_anilogo 3s linear infinite; animation:main_anilogo 3s linear infinite;-webkit-transform-origin:center center;-ms-transform-origin:center center;} |
|
#section5_logo2 {position:absolute;top:338px;left:270px; transform-origin:center center;-webkit-animation: main_anilogo 3s linear infinite; -ms-animation: main_anilogo 3s linear infinite; animation:main_anilogo 3s linear infinite;-webkit-transform-origin:center center;-ms-transform-origin:center center;} |
|
#section5_wheel1 {position:absolute;top:501px;left:435px; width:162px; height:162px;-webkit-animation: main_aniwheel 5s linear infinite; -ms-animation: main_aniwheel 5s linear infinite; animation:main_aniwheel 5s linear infinite;} |
|
#section5_wheel2 {position:absolute;top:759px;left:439px; -webkit-animation: main_aniwheel 2s linear infinite; -ms-animation: main_aniwheel 2s linear infinite; animation:main_aniwheel 2s linear infinite;} |
|
#section5_wheel3 {position:absolute;top:830px;left:423px; -webkit-animation: main_aniwheel 2s linear infinite; -ms-animation: main_aniwheel 2s linear infinite; animation:main_aniwheel 2s linear infinite;} |
|
|
|
/* section 6 */ |
|
|
|
#main_section6 section {padding:156px 0 0 0; color:#fff; font-size:48px; line-height:65px; text-align:center;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#skrollr-body {height:100%; width:100%;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* main key visual carousel */ |
|
|
|
|
|
/* --------------------------------------------- */ |
|
/* main carousel settings */ |
|
/* --------------------------------------------- */ |
|
|
|
.main_kv_container { |
|
/* defaults for responsive height container */ |
|
position: relative; |
|
width: 100%; |
|
height: 535px; |
|
overflow: visible; |
|
} |
|
|
|
#main_kv_slider { |
|
width: 100%; |
|
height: 535px; |
|
} |
|
|
|
#main_kv_slider .slider { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#main_kv_slider .slider .item { |
|
float: left; |
|
width: 100%; |
|
} |
|
|
|
#main_kv_slider .slider .item img { |
|
width: 100%; |
|
height: auto; |
|
} |
|
|
|
.main_kv_container .prev { |
|
position: absolute; |
|
top: 0; |
|
left: 0; |
|
width: 100px; |
|
height: 535px; |
|
z-index: 10; |
|
background:url("../images/main/main_slider_prev.png") no-repeat -15px center; |
|
} |
|
|
|
.main_kv_container .next { |
|
position: absolute; |
|
top: 0; |
|
right: 0; |
|
width: 100px; |
|
height: 535px; |
|
z-index: 10; |
|
background:url("../images/main/main_slider_next.png") no-repeat left center; |
|
} |
|
|
|
|
|
.main_kv_container .slideSelectors { |
|
position: absolute; |
|
bottom: 40px; |
|
left: 40%; |
|
width: 300px; //控制banner 滚动图片的宽度 |
|
margin-left:-30px; |
|
z-index: 1; |
|
height: 10px; |
|
} |
|
|
|
.main_kv_container .slideSelectors .item { |
|
float: left; |
|
width: 12px; |
|
height: 12px; |
|
border: 1px solid #bbb; |
|
background: #bbb; |
|
margin: 0 0 0 10px; |
|
border-radius:6px; |
|
opacity: 0.5; |
|
filter: alpha(opacity=50); |
|
} |
|
|
|
.main_kv_container .slideSelectors .selected { |
|
background: #fff; |
|
opacity: 1; |
|
filter: alpha(opacity=100); |
|
} |
|
|
|
|
|
|
|
/* --------------------------------------------- */ |
|
/* main carousel settings */ |
|
/* --------------------------------------------- */ |