/* Code tidied up by ScrapBook */
html, body, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, blockquote, pre, hr, figure, table, caption, th, td, form, fieldset, legend, input, button, textarea, menu { margin: 0px; padding: 0px; }
body { padding: 0px; margin: 0px; background: rgb(255, 255, 255) url("footerbg.jpg") no-repeat scroll center bottom; }
img { border: medium none; vertical-align: middle; }
html, body, fieldset, img, iframe, abbr { border: 0px none; }
li { list-style: outside none none; }
textarea { overflow: auto; resize: none; }
a, button { cursor: pointer; }
h1, h2, h3, h4, h5, h6, em, strong, b { font-weight: 700; }
a, a:hover { text-decoration: none; }
body, textarea, input, button { color: rgb(98, 161, 201); }
html, body { width: 100%; height: auto; font-family: "Microsoft YaHei",Tahoma,Helvetica Neue,Helvetica,Arial,Hiragino Sans GB,Microsoft Yahei,Simhei,sans-serif; }
.hide { display: none; }
.f-cb::after, .f-cbli li::after { display: block; clear: both; visibility: hidden; height: 0px; overflow: hidden; content: "."; }
.f-cb, .f-cbli li {  }
.f-ib { display: inline-block; }
.f-dn { display: none; }
.f-db { display: block; }
.f-fl { float: left; }
.f-fr { float: right; }
.g-wrap { width: 100%; max-width: 1920px; margin: -240px auto 0px; font-size: 14px; overflow: hidden; }
.g-header { height: 422px; }
.g-header-cnt { width: 1200px; margin: 0px auto; position: relative; padding-top: 0px; z-index: 99; }
.g-header-cnt .g-news { position: relative; }
.g-cnt-2 { height: 800px; background: rgba(0, 0, 0, 0) url("bg-2.jpg") no-repeat scroll center top; }
.g-bottom { height: 400px; background: rgba(0, 0, 0, 0) url("bg-4.jpg") no-repeat scroll center top; position: relative; }
.m-nav { height: 80px; background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0%; position: relative; }
.m-nav .logo { width: 173px; height: 141px; background: rgba(0, 0, 0, 0) url("logo.png") no-repeat scroll 0% 0%; margin-left: -86px; position: absolute; left: 50%; opacity: 0; transition: all 0.5s ease 0s; transform: scale(1.5); }
.m-nav .logo.active { opacity: 1; transform: scale(1); }
.m-nav .nav { width: 1050px; margin: 0px auto; line-height: 80px; }
.m-nav .nav a { display: inline-block; width: 64px; text-align: center; margin: 0px 40px; color: rgb(255, 255, 255); transition: all 0.3s ease 0s; font-size: 16px; }
.m-nav .nav a:hover { color: rgb(26, 187, 193); }
.m-download { width: 600px; height: 138px; background: rgba(255, 255, 255, 0.5) none repeat scroll 0% 0%; border-radius: 10px; position: relative; margin-bottom: 20px; left: 0px; z-index: 99; }
.m-download .qrCnt { width: 127px; height: 112px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border-radius: 10px; position: absolute; top: 12px; left: 12px; z-index: 99; }
.m-download .qrCnt .codeImg { display: block; width: 112px; height: 112px; background: rgba(0, 0, 0, 0) url("weixin.jpg") no-repeat scroll 0% 0% / 100% 100%; position: absolute; left: 22px; top: 0px; }
.m-download .qrCnt .txt { width: 14px; display: block; font-size: 12px; color: rgb(51, 51, 51); position: absolute; top: 8px; left: 7px; }
.m-download .ios_download { display: block; width: 150px; height: 46px; background: rgba(0, 0, 0, 0) url("ios_download.png") no-repeat scroll 0% 0%; position: absolute; top: 12px; left: 160px; font-size: 16px; color: rgb(255, 255, 255); line-height: 40px; padding-top: 10px; padding-left: 58px; text-indent: -99em; }
.m-download .ios_download span { font-size: 18px; }
.m-download .ios_download:hover { background: rgba(0, 0, 0, 0) url("ios_download_hover.png") no-repeat scroll 0% 0%; }
.m-download .android_download { display: block; width: 150px; height: 50px; background: rgba(0, 0, 0, 0) url("andriod_download.png") no-repeat scroll 0% 0%; position: absolute; top: 73px; left: 160px; font-size: 20px; color: rgb(255, 255, 255); line-height: 50px; padding-left: 58px; text-indent: -99em; }
.m-download .android_download:hover { background: rgba(0, 0, 0, 0) url("andriod_download_hover.png") no-repeat scroll 0% 0%; }
.m-download .ios_download2 { display: block; width: 150px; height: 46px; background: rgba(0, 0, 0, 0) url("paybtn.png") no-repeat scroll 0% 0%; position: absolute; top: 12px; left: 380px; font-size: 16px; color: rgb(255, 255, 255); line-height: 40px; padding-top: 10px; padding-left: 58px; text-indent: -99em; }
.m-download .ios_download2 span { font-size: 18px; }
.m-download .ios_download2:hover { background: rgba(0, 0, 0, 0) url("paybtn_hover.png") no-repeat scroll 0% 0%; }
.m-download .android_download2 { display: block; width: 150px; height: 50px; background: rgba(0, 0, 0, 0) url("patchbtn.png") no-repeat scroll 0% 0%; position: absolute; top: 73px; left: 380px; font-size: 20px; color: rgb(255, 255, 255); line-height: 50px; padding-left: 58px; text-indent: -99em; }
.m-download .android_download2:hover { background: rgba(0, 0, 0, 0) url("patchbtn_hover.png") no-repeat scroll 0% 0%; }
.m-banner { width: 456px; position: absolute; top: 0px; left: 0px; }
.m-banner .pcnt { text-align: center; margin-top: 10px; }
.m-banner .c { display: inline-block; width: 15px; height: 15px; background: rgba(0, 0, 0, 0) url("c_d8e31c3.png") no-repeat scroll 0% 0%; margin: 0px 7px; cursor: pointer; }
.m-banner .c.active { background: rgba(0, 0, 0, 0) url("c_active_84b2caa.png") no-repeat scroll 0% 0%; }
.m-banner .gfBannerSlider { overflow: hidden; visibility: hidden; position: relative; }
.m-banner .swipe-wrap { overflow: hidden; position: relative; }
.m-banner .swipe-wrap > a { float: left; width: 100%; position: relative; display: block; }
.m-banner .swipe-wrap > a img { display: block; }
.m-banner .swipe-wrap > a::after { display: block; position: absolute; top: 10px; left: 10px; right: 10px; bottom: 10px; border: 1px solid rgb(255, 255, 255); content: ""; }
.m-banner .bannerCnt { width: 456px; height: 360px; background-color: rgb(71, 209, 214); overflow: hidden; }
.m-news { width: 744px; height: 360px; background: rgba(0, 0, 0, 0) url("news_bg.jpg") no-repeat scroll 0% 0%; position: absolute; top: 0px; left: 456px; overflow: hidden; }
.m-news .cnt { padding: 20px; }
.m-news .nav { border-bottom: 1px solid rgb(47, 193, 198); }
.m-news .nav li { font-size: 14px; color: rgb(51, 51, 51); display: block; width: 120px; height: 30px; text-align: center; line-height: 30px; cursor: pointer; }
.m-news .nav li.active { font-size: 16px; border-bottom: 2px solid rgb(47, 193, 198); }
.m-news .nav .more { display: block; width: 23px; height: 23px; background: rgba(0, 0, 0, 0) url("more.png") no-repeat scroll 0% 0%; transition: all 0.3s ease 0s; }
.m-news .nav .more:hover { background: rgba(0, 0, 0, 0) url("more_hover.png") no-repeat scroll 0% 0%; }
.m-news .tab { margin-top: 13px; display: none; }
.m-news .tab .headline { width: 684px; height: 43px; background: rgb(43, 51, 70) none repeat scroll 0% 0%; border: 1px solid rgb(215, 229, 229); display: block; line-height: 43px; text-align: center; color: rgb(255, 255, 255); font-size: 16px; font-weight: bold; box-shadow: 1px 2px 2px rgb(224, 241, 233); margin-bottom: 25px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0px 10px; }
.m-news .tab li { position: relative; margin-top: 80px; opacity: 0; }
.m-news .tab li:nth-child(1) { transition: all 0.5s ease 0s; }
.m-news .tab li:nth-child(2) { transition: all 0.6s ease 0s; }
.m-news .tab li:nth-child(3) { transition: all 0.7s ease 0s; }
.m-news .tab li:nth-child(4) { transition: all 0.8s ease 0s; }
.m-news .tab li:nth-child(5) { transition: all 0.9s ease 0s; }
.m-news .tab li:nth-child(6) { transition: all 1s ease 0s; }
.m-news .tab li:nth-child(7) { transition: all 1.1s ease 0s; }
.m-news .tab.active li { margin-top: 0px; opacity: 1; }
.m-news .tab .news_item { color: rgb(43, 51, 70); display: block; width: 700px; height: 20px; line-height: 20px; margin-bottom: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-news .tab .news_item:hover { color: rgb(189, 167, 101); }
.m-news .tab .news_item .time { position: absolute; right: 0px; top: 0px; color: rgb(171, 194, 195); }
.m-activity { width: 288px; height: 910px; background: rgba(0, 0, 0, 0) url("rl_bg.png") no-repeat scroll 0% 0%; position: absolute; top: 0px; left: 912px; z-index: 2; }
.m-activity .cnt { position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border: 1px solid rgb(255, 255, 255); }
.m-activity .cnt h3 { font-size: 24px; color: rgb(0, 0, 0); background: rgba(0, 0, 0, 0) url("icon_rili.png") no-repeat scroll 25px 0px; padding-left: 87px; height: 38px; line-height: 38px; margin-top: 6px; margin-bottom: 20px; }
.m-activity .cnt .list { position: relative; }
.m-activity .cnt .list .item { position: absolute; width: 256px; border-width: 2px 1px 3px; border-style: solid; border-color: rgb(47, 193, 198) rgb(226, 239, 236) rgb(226, 239, 236); left: 9px; background: rgba(255, 255, 255, 0.5) none repeat scroll 0% 0%; height: 94px; overflow: hidden; box-sizing: border-box; padding: 10px 17px; transition: all 0.3s ease 0s; color: rgb(88, 88, 88); }
.m-activity .cnt .list .item:hover { height: 200px; background: rgb(255, 254, 247) none repeat scroll 0% 0%; }
.m-activity .cnt .list .item .t .txt { font-size: 18px; color: rgb(0, 0, 0); font-weight: 700; }
.m-activity .cnt .list .item .limit { margin-top: 10px; font-size: 14px; height: 38px; }
.m-activity .cnt .list .item .detail { margin-top: 8px; border-top: 1px dashed rgb(118, 118, 118); padding-top: 22px; padding-bottom: 22px; }
.m-activity .cnt .list .item:nth-child(1) { border-top: 2px solid rgb(241, 75, 77); }
.m-activity .cnt .list .item:nth-child(2) { border-top: 2px solid rgb(244, 224, 166); top: 113px; }
.m-activity .cnt .list .item:nth-child(3) { top: 226px; }
.m-activity .cnt .list .item:nth-child(4) { top: 339px; }
.m-activity .cnt .list .item:nth-child(5) { top: 452px; }
.m-activity .cnt .list .item:nth-child(6) { top: 565px; }
.m-activity .cnt .list .item:nth-child(7) { top: 678px; }
.m-roles { width: 1200px; margin: 0px auto; position: relative; }
.m-roles h3 { background: rgba(0, 0, 0, 0) url("icon_role.png") no-repeat scroll 0% 0%; height: 38px; padding-left: 62px; line-height: 38px; position: absolute; color: rgb(0, 0, 0); font-size: 24px; top: 21px; left: 7px; }
.m-roles .more { display: block; height: 23px; background: rgba(0, 0, 0, 0) url("more.png") no-repeat scroll 0% 0%; width: 100px; padding-left: 30px; line-height: 23px; transition: all 0.3s ease 0s; color: rgb(51, 51, 51); position: absolute; top: 20px; right: 280px; z-index: 9; }
.m-roles .more:hover { background: rgba(0, 0, 0, 0) url("more_hover.png") no-repeat scroll 0% 0%; }
.m-roles #roleCarousel { height: 700px; width: 1040px; position: relative; margin: 0px auto; }
.m-roles #roleCarousel img { border: 0px none; }
.m-roles #roleCarousel .role { position: absolute; top: 1000px; cursor: pointer; transition: opacity 0.1s ease 0s; }
.m-roles #roleCarousel .role a { display: block; }
.m-roles #roleCarousel .role a .name { width: 40px; margin-top: 30px; text-align: center; height: 146px; line-height: 146px; position: absolute; transition: all 0.3s ease 0s; background: rgba(0, 0, 0, 0) url("role_name.png") no-repeat scroll 0% 0%; left: 50px; opacity: 0; }
.m-roles #roleCarousel .role a .name .icon { display: block; margin: 10px auto 0px; }
.m-roles #roleCarousel .role a .name .icon.icon-1 { width: 16px; height: 19px; background: rgba(0, 0, 0, 0) url("1_a2a1dab.png") no-repeat scroll 0% 0%; }
.m-roles #roleCarousel .role a .name .icon.icon-2 { width: 18px; height: 19px; background: rgba(0, 0, 0, 0) url("2_2af7edc.png") no-repeat scroll 0% 0%; }
.m-roles #roleCarousel .role a .name .icon.icon-3 { width: 19px; height: 15px; background: rgba(0, 0, 0, 0) url("3_5f35086.png") no-repeat scroll 0% 0%; }
.m-roles #roleCarousel .role a .name .txt { width: 20px; text-align: center; display: inline-block; margin: 0px auto; font-size: 16px; color: rgb(0, 0, 0); line-height: 17px; vertical-align: middle; padding-bottom: 68px; }
.m-roles #roleCarousel .role a .name .arraw { display: block; width: 30px; height: 28px; background: rgba(0, 0, 0, 0) url("role_arrow.png") no-repeat scroll 0% 0%; position: absolute; margin-left: -15px; left: 50%; bottom: 5px; }
.m-roles #roleCarousel .role a:hover .arraw { animation: 0.8s ease-in-out 0s normal none 1 running arrow; }
.m-roles #roleCarousel .role.active a .name { opacity: 1; }
.m-roles #roleCarousel .blipsContainer { position: absolute; width: 1000px; height: 40px; color: rgb(255, 255, 255); top: 710px; left: 50%; margin-left: -180px; }
.m-roles #roleCarousel .blipsContainer .blip { height: 38px; width: 128px; border: 2px solid rgb(44, 51, 70); line-height: 34px; text-align: center; color: rgb(0, 0, 0); margin-left: -2px; box-sizing: border-box; position: relative; transition: background 0.4s ease 0s; }
.m-roles #roleCarousel .blipsContainer .blip:hover { background-color: rgb(44, 51, 70); color: rgb(225, 198, 139); }
.m-roles #roleCarousel .blipsContainer .blip .border { width: 128px; height: 38px; border: 2px solid rgb(44, 51, 70); position: absolute; top: -2px; left: -2px; display: none; box-sizing: border-box; z-index: 1; }
.m-roles #roleCarousel .blipsContainer .blipSelected { border: 4px solid rgb(255, 255, 255); background-color: rgb(44, 51, 70); line-height: 30px; color: rgb(255, 255, 255); }
.m-roles #roleCarousel .blipsContainer .blipSelected .border { display: block; top: -4px; left: -4px; }
.m-shuiche { width: 469px; height: 207px; background: rgba(0, 0, 0, 0) url("shuiche.png") no-repeat scroll 0% 0%; position: absolute; top: 490px; left: 50%; margin-left: 230px; }
.m-feature { width: 1200px; margin: 0px auto; position: relative; }
.m-feature h3 { background: rgba(0, 0, 0, 0) url("icon_feature.png") no-repeat scroll 0% 0%; height: 38px; padding-left: 62px; line-height: 38px; position: absolute; color: rgb(0, 0, 0); font-size: 24px; top: 20px; left: 7px; }
.m-feature #featureCarousel { height: 770px; position: relative; }
.m-feature #featureCarousel img { border: 0px none; }
.m-feature #featureCarousel .feature { position: absolute; top: -1000px; cursor: pointer; transition: opacity 0.1s ease 0s; }
.m-feature #featureCarousel .feature a { display: block; }
.m-feature #featureCarousel .feature a .name { width: 40px; height: 146px; position: absolute; transition: all 0.3s ease 0s; background: rgba(0, 0, 0, 0) url("role_name.png") no-repeat scroll 0% 0%; left: 50px; opacity: 0; }
.m-feature #featureCarousel .feature.active a .name { opacity: 1; }
.m-feature #featureCarousel .feature .border { position: absolute; top: 10px; left: 10px; right: 10px; bottom: 10px; border: 1px solid rgb(255, 255, 255); }
.m-feature #featureCarousel .blipsContainer { position: absolute; top: 750px; left: 50%; margin-left: -75px; }
.m-feature #featureCarousel .blipsContainer .blip { height: 15px; width: 15px; background: rgba(0, 0, 0, 0) url("c_d8e31c3.png") no-repeat scroll 0% 0%; margin-right: 15px; }
.m-feature #featureCarousel .blipsContainer .blipSelected { background: rgba(0, 0, 0, 0) url("c_active_84b2caa.png") no-repeat scroll 0% 0%; }
.m-bottom { position: relative; height: 880px; }
.m-bottom .t { font-size: 24px; color: rgb(88, 88, 88); letter-spacing: 40px; text-align: center; width: 100%; position: absolute; top: 150px; transition: all 0.8s ease 0s; opacity: 0; }
.m-bottom .moon { width: 180px; height: 180px; background: rgba(0, 0, 0, 0) url("moon.png") no-repeat scroll 0% 0%; margin-left: -95px; left: 50%; position: absolute; top: 100px; margin-bottom: 80px; transition: all 0.8s ease 0.1s; opacity: 0; margin-top: 80px; }
.m-bottom .line { width: 1px; height: 60px; border-left: 1px solid rgb(47, 193, 198); position: absolute; left: 50%; top: 137px; transition: all 0.8s ease 0.2s; opacity: 0; margin-top: 80px; }
.m-bottom .left { width: 293px; height: 72px; background: rgba(0, 0, 0, 0) url("moon_left.png") no-repeat scroll 0% 0%; position: absolute; top: 250px; left: 50%; margin-left: -462px; transition: all 0.8s ease 0.3s; opacity: 0; margin-top: 80px; }
.m-bottom .right { width: 293px; height: 72px; background: rgba(0, 0, 0, 0) url("moon_right.png") no-repeat scroll 0% 0%; position: absolute; top: 250px; right: 50%; margin-right: -462px; transition: all 0.8s ease 0.3s; opacity: 0; margin-top: 80px; }
.m-bottom .qr { width: 145px; height: 145px; background: rgba(0, 0, 0, 0) url("weixin_qr.jpg") no-repeat scroll 0% 0%; position: absolute; top: 223px; margin-left: -72px; left: 50%; transition: all 0.8s ease 0.4s; opacity: 0; margin-top: 80px; }
.m-bottom .p { font-size: 18px; color: rgb(88, 88, 88); text-align: center; line-height: 29px; position: absolute; width: 100%; top: 395px; transition: all 0.8s ease 0.5s; opacity: 0; margin-top: 80px; }
.m-bottom .topBtn { width: 178px; height: 40px; line-height: 40px; text-align: center; display: block; color: rgb(43, 51, 70); border: 1px solid rgb(43, 51, 70); position: absolute; margin-left: -89px; left: 50%; top: 250px; transition: opacity 0.8s ease 0.6s; opacity: 0; }
.m-bottom .topBtn:hover { background: rgb(43, 51, 70) none repeat scroll 0% 0%; color: rgb(255, 255, 255); }
.m-bottom #NIE-copyRight { bottom: 20px; position: absolute; margin-left: -420px; left: 50%; color: rgb(0, 0, 0); }
.m-bottom #NIE-copyRight a { color: rgb(0, 0, 0) !important; }
.m-bottom.active .t { margin-top: 0px; opacity: 1; }
.m-bottom.active .moon { margin-top: 0px; opacity: 1; }
.m-bottom.active .line { margin-top: 0px; opacity: 1; }
.m-bottom.active .left { margin-top: 0px; opacity: 1; }
.m-bottom.active .right { margin-top: 0px; opacity: 1; }
.m-bottom.active .qr { margin-top: 0px; opacity: 1; }
.m-bottom.active .p { margin-top: 0px; opacity: 1; }
.m-bottom.active .topBtn { margin-top: 0px; opacity: 1; }
.taohua-1 { width: 432px; height: 633px; position: absolute; background: rgba(0, 0, 0, 0) url("taohua.png") no-repeat scroll 0% 0%; left: 0px; top: -238px; }
.taohua-2 { width: 257px; height: 291px; background: rgba(0, 0, 0, 0) url("taohua-2.png") no-repeat scroll 0% 0%; position: absolute; top: 193px; right: 10px; }
.m-giftPopup { position: fixed; top: 0px; left: 0px; bottom: 0px; right: 0px; z-index: 999; background: rgba(0, 0, 0, 0.9) none repeat scroll 0% 0%; display: none; }
.m-giftPopup .giftPopup { width: 1096px; height: 540px; background: rgba(0, 0, 0, 0) url("gift_pop.png") no-repeat scroll 0% 0%; margin-left: -660px; position: absolute; left: 50%; margin-top: -270px; top: 50%; color: rgb(0, 0, 0); }
.m-giftPopup .giftPopup .cnt { width: 530px; margin-left: 468px; padding-top: 78px; }
.m-giftPopup .giftPopup .cnt .t { font-size: 28px; font-weight: 700; }
.m-giftPopup .giftPopup .cnt .p1 { font-size: 16px; line-height: 24px; margin-top: 28px; }
.m-giftPopup .giftPopup .cnt .p2 { font-size: 24px; color: rgb(241, 75, 77); margin-top: 28px; }
.m-giftPopup .giftPopup .cnt .p2 .code { font-weight: 700; }
.m-giftPopup .giftPopup .cnt .p3 { font-size: 16px; font-weight: 700; margin-top: 12px; }
.m-giftPopup .giftPopup .cnt .p4 { font-size: 14px; line-height: 24px; margin-top: 14px; }
.m-giftPopup .giftPopup .cnt img { margin-top: 20px; }
.m-giftPopup .closeBtn { position: absolute; width: 95px; height: 261px; background: rgba(0, 0, 0, 0) url("gift_close.png") no-repeat scroll 0% 0%; top: 35px; right: 4px; transition: all 0.3s ease 0s; }
.m-giftPopup .closeBtn:hover { background: rgba(0, 0, 0, 0) url("gift_close_hover.png") no-repeat scroll 0% 0%; }
.m-orderBtn { width: 317px; height: 102px; background: rgba(0, 0, 0, 0) url("r_tips_btn.png") no-repeat scroll 0% 0%; position: fixed; right: 10px; bottom: -160px; cursor: pointer; z-index: 999999; transition: all 0.3s ease 0s; }
.m-orderBtn.active { bottom: 10px; }
.m-orderBtn .hand { width: 47px; height: 62px; background: rgba(0, 0, 0, 0) url("r_tips_hand.png") no-repeat scroll 0% 0%; right: 20px; top: -54px; position: absolute; transform-origin: 50% 100% 0px; animation: 1s ease-in-out 0s normal none infinite running hand; }
.m-orderBtn:hover .hand { animation: 0s ease 0s normal none 1 running none; }
.m-order-content { width: 1228px; height: 192px; background: rgba(0, 0, 0, 0) url("order_content.png") no-repeat scroll 0% 0%; position: fixed; margin-left: -614px; left: 50%; z-index: 99999; bottom: -230px; color: rgb(189, 167, 101); transition: all 0.3s ease 0s; }
.m-order-content.active { bottom: 10px; }
.m-order-content .joinCnt { width: 344px; text-align: center; color: rgb(88, 88, 88); }
.m-order-content .joinCnt .t { font-size: 24px; color: rgb(241, 75, 77); padding-top: 32px; margin-bottom: 17px; }
.m-order-content .joinCnt .t .b { font-weight: 700; }
.m-order-content .joinCnt .joinBtn { display: block; width: 191px; height: 41px; background: rgb(241, 75, 77) none repeat scroll 0% 0%; margin: 0px auto 16px; line-height: 41px; color: rgb(255, 255, 255); font-size: 16px; border-radius: 5px; }
.m-order-content .joinCnt .joinBtn:hover { background: rgb(239, 87, 89) none repeat scroll 0% 0%; }
.m-order-content .gap { width: 4px; height: 124px; border-left: 1px solid rgb(172, 227, 225); border-right: 1px solid rgb(172, 227, 225); margin-top: 35px; }
.m-order-content .awardCnt { width: 800px; margin-left: 75px; }
.m-order-content .awardCnt .item { width: 105px; margin-top: 34px; text-align: center; }
.m-order-content .awardCnt .item .award { display: block; width: 75px; height: 75px; background: rgba(0, 0, 0, 0) url("award_bg.png") no-repeat scroll 0% 0%; margin: 0px auto; opacity: 0.5; position: relative; }
.m-order-content .awardCnt .item .award .tag { width: 82px; height: 64px; background: rgba(0, 0, 0, 0) url("complete_tag.png") no-repeat scroll 0% 0%; position: absolute; top: -13px; left: -30px; display: none; }
.m-order-content .awardCnt .item .award .img { display: block; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.m-order-content .awardCnt .item .award .img.img-1 { background: rgba(0, 0, 0, 0) url("1_0e5d7c8.png") no-repeat scroll 0% 0%; }
.m-order-content .awardCnt .item .award .img.img-2 { background: rgba(0, 0, 0, 0) url("2_7cbb938.png") no-repeat scroll 0% 0%; }
.m-order-content .awardCnt .item .award .img.img-3 { background: rgba(0, 0, 0, 0) url("3_8fb5308.png") no-repeat scroll 0% 0%; }
.m-order-content .awardCnt .item .award .img.img-4 { background: rgba(0, 0, 0, 0) url("4_777900e.png") no-repeat scroll 0% 0%; }
.m-order-content .awardCnt .item .award .img.img-5 { background: rgba(0, 0, 0, 0) url("5_a5429aa.png") no-repeat scroll 0% 0%; }
.m-order-content .awardCnt .item .name { display: block; margin-top: 12px; }
.m-order-content .awardCnt .item .num { margin-top: 6px; display: block; }
.m-order-content .awardCnt .item.active .award { opacity: 1; }
.m-order-content .awardCnt .item.active .tag { display: block; }
.m-order-content .awardCnt .dashed { display: block; width: 45px; height: 5px; background: rgba(0, 0, 0, 0) url("dashed_line.png") no-repeat scroll 0% 0%; margin-top: 67px; }
.m-order-content .awardCnt .dashed.active { background: rgba(0, 0, 0, 0) url("dashed_line_active.png") no-repeat scroll 0% 0%; }
.m-order-content .closeBtn { display: block; width: 56px; height: 32px; background: rgb(47, 193, 198) url("order_content_close.png") no-repeat scroll center center; position: absolute; top: -32px; right: 16px; }
.m-flotage-left { width: 198px; height: 248px; background: rgba(0, 0, 0, 0) url("flotage_left.png") no-repeat scroll 0% 0%; position: fixed; left: 0px; display: block; bottom: 100px; z-index: 999999; }
.m-flotage-left .p1 { color: rgb(241, 75, 77); font-weight: 700; padding-top: 140px; text-align: center; }
.m-flotage-left .p2 { color: rgb(51, 51, 51); font-size: 14px; width: 140px; margin-left: 25px; margin-top: 10px; }
.m-slogan { width: 498px; height: 280px; background: rgba(0, 0, 0, 0) url("slogan_dc.png") no-repeat scroll 0% 0%; position: absolute; top: 63px; left: 57px; }
.m-share { width: 50px; margin-top: -100px; position: fixed; top: 50%; right: 0px; z-index: 9999999; }
.m-share .item { display: block; height: 50px; }
.m-share .item .icon { display: block; width: 100%; height: 100%; }
.m-share .item .icon.icon-1 { background: rgb(43, 51, 70) url("icon_weixin.png") no-repeat scroll center center; }
.m-share .item .icon.icon-2 { background: rgb(43, 51, 70) url("qq.png") no-repeat scroll center center; }
.m-share .item .icon.icon-3 { background: rgb(43, 51, 70) url("weibo.png") no-repeat scroll center center; }
.m-share .item .icon.icon-4 { background: rgb(43, 51, 70) url("top.png") no-repeat scroll center center; }
.m-share .item:hover .icon.icon-1 { background: rgb(244, 249, 250) url("icon_weixin_active.png") no-repeat scroll center center; }
.m-share .item:hover .icon.icon-2 { background: rgb(244, 249, 250) url("qq_active.png") no-repeat scroll center center; }
.m-share .item:hover .icon.icon-3 { background: rgb(244, 249, 250) url("weibo_active.png") no-repeat scroll center center; }
.m-share .item:hover .icon.icon-4 { background: rgb(244, 249, 250) url("top_active.png") no-repeat scroll center center; }
.m-share .item.weixin { position: relative; }
.m-share .item.weixin .qrCnt { width: 145px; height: 200px; background: rgb(234, 234, 234) none repeat scroll 0% 0%; position: absolute; top: 0px; right: 50px; display: none; }
.m-share .item.weixin .qrCnt img { display: block; width: 120px; height: 120px; margin: 13px auto 0px; }
.m-share .item.weixin .qrCnt p { text-align: center; color: rgb(51, 51, 51); font-size: 14px; margin-top: 12px; }
.m-share .item.weixin:hover .qrCnt { display: block; }
.m-share .item.qq { position: relative; cursor: pointer; }
.m-share .item.qq .qqCnt { width: 145px; height: 276px; background: rgb(234, 234, 234) none repeat scroll 0% 0%; position: absolute; top: 0px; right: 50px; display: none; }
.m-share .item.qq .qqCnt a { display: block; width: 126px; height: 56px; margin: 17px auto 0px; text-align: center; color: rgb(51, 51, 51); }
.m-share .item.qq .qqCnt a:nth-child(1) { border-bottom: 1px dashed rgb(187, 187, 187); }
.m-share .item.qq .qqCnt a:nth-child(2) { border-bottom: 1px dashed rgb(187, 187, 187); margin-top: 10px; }
.m-share .item.qq .qqCnt a:nth-child(3) { border-bottom: 1px dashed rgb(187, 187, 187); margin-top: 10px; }
.m-share .item.qq .qqCnt a:nth-child(4) { margin-top: 10px; }
.m-share .item.qq .qqCnt a .num { font-weight: 700; font-size: 18px; color: rgb(47, 193, 198); }
.m-share .item.qq:hover .qqCnt { display: block; }
.m-lantern { position: absolute; width: 10px; height: 10px; top: 437px; left: -210px; }
.m-lantern .lantern { width: 131px; height: 172px; background: rgba(0, 0, 0, 0) url("lantern.png") no-repeat scroll 0% 0%; transform-origin: 25% 0px 0px; animation: 8s ease 0s normal none infinite running lantern_keyframes; position: absolute; left: -20px; top: -5px; }
.m-lantern .lantern .tail { width: 98px; height: 75px; background: rgba(0, 0, 0, 0) url("tail.png") no-repeat scroll 0% 0%; position: absolute; top: 152px; left: 90px; transform-origin: 10% 0px 0px; animation: 8s ease 0s normal none infinite running tail_keyframes; }
.red { color: rgb(241, 75, 77); }
@keyframes lantern_keyframes {
0% { transform: rotate(30deg); }
50% { transform: rotate(0deg); }
100% { transform: rotate(30deg); }
}
@keyframes lantern_keyframes {
0% { transform: rotate(30deg); }
50% { transform: rotate(0deg); }
100% { transform: rotate(30deg); }
}
@keyframes lantern_keyframes {
0% { transform: rotate(30deg); }
50% { transform: rotate(0deg); }
100% { transform: rotate(30deg); }
}
@keyframes tail_keyframes {
0% { transform: rotate(60deg); }
50% { transform: rotate(0deg); }
100% { transform: rotate(60deg); }
}
@keyframes tail_keyframes {
0% { transform: rotate(60deg); }
50% { transform: rotate(0deg); }
100% { transform: rotate(60deg); }
}
@keyframes tail_keyframes {
0% { transform: rotate(60deg); }
50% { transform: rotate(0deg); }
100% { transform: rotate(60deg); }
}
.m-petal .parent { position: absolute; left: -20px; top: 0px; right: 0px; bottom: 0px; height: 700px; overflow: hidden; perspective: 1000px; }
.m-petal .petal { margin: 1px; animation: 10s linear 0s normal none infinite running fall1; position: absolute; top: 0px; left: 0px; background: rgb(254, 133, 192) none repeat scroll 0% 0%; width: 10px; height: 10px; box-shadow: 3px 3px 5px -3px rgb(255, 255, 255) inset; border-radius: 15px 5px 15px 0px; backface-visibility: hidden; transform-style: preserve-3d; }
.m-petal .petal::after { content: ""; right: 0px; bottom: 0px; position: absolute; top: 0px; left: 0px; background: rgb(254, 133, 192) none repeat scroll 0% 0%; border-radius: 15px 5px 15px 0px; transform: rotateY(180deg); transform-style: preserve-3d; backface-visibility: hidden; }
.m-petal .petal:nth-child(2) { animation-name: fall2; animation-delay: 1.25s; top: 10%; }
.m-petal .petal:nth-child(3) { animation-name: fall3; animation-delay: 4.65s; top: 25%; }
.m-petal .petal:nth-child(4) { animation-name: fall4; animation-delay: 1.15s; top: 30%; }
.m-petal .petal:nth-child(5) { animation-name: fall5; animation-delay: 1.35s; top: 50%; }
.m-petal .petal:nth-child(6) { animation-name: fall6; animation-delay: 3.25s; top: 75%; }
.m-petal .petal:nth-child(7) { animation-name: fall2; animation-delay: 2.25s; top: 10%; }
.m-petal .petal:nth-child(8) { animation-name: fall3; animation-delay: 3.65s; top: 25%; }
.m-petal .petal:nth-child(9) { animation-name: fall4; animation-delay: 0.15s; top: 30%; }
.m-petal .petal:nth-child(10) { animation-name: fall5; animation-delay: 1.25s; top: 50%; }
.m-petal .petal:nth-child(11) { animation-name: fall6; animation-delay: 0.25s; top: 75%; }
.m-petal .petal:nth-child(12) { animation-name: fall6; animation-delay: 1.75s; top: 85%; }
@keyframes fall1 {
100% { transform: translateY(400px) translateX(1960px) translateZ(200px) rotate3d(1, 0.25, 0, 320deg); }
}
@keyframes fall2 {
100% { transform: translateY(450px) translateX(1960px) translateZ(500px) rotate3d(1, 0.25, 0.25, 220deg); }
}
@keyframes fall3 {
100% { transform: translateY(350px) translateX(1960px) translateZ(300px) rotate3d(0.25, 1, 1, 420deg); }
}
@keyframes fall4 {
100% { transform: translateY(560px) translateX(1960px) translateZ(-500px) rotate3d(1, 1, 0.25, 720deg); }
}
@keyframes fall5 {
100% { transform: translateY(500px) translateX(1960px) translateZ(400px) rotate3d(0.25, 1, 0.25, 820deg); }
}
@keyframes fall6 {
100% { transform: translateY(400px) translateX(1960px) translateZ(-100px) rotate3d(1, 1, 1, 720deg); }
}
@keyframes hand {
0% { transform: scale(1); }
60% { transform: scale(1.08); }
100% { transform: scale(1); }
}
@keyframes arrow {
0% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
40% { opacity: 0; transform: translate3d(10px, 0px, 0px); }
60% { opacity: 0; transform: translate3d(-10px, 0px, 0px); }
100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
.m-giftTips { width: 480px; height: 210px; background: rgb(253, 254, 237) none repeat scroll 0% 0%; border: 1px solid rgb(233, 200, 142); position: absolute; top: 100px; left: 100px; color: rgb(89, 89, 88); margin-left: -240px; margin-top: -230px; z-index: 9; display: none; }
.m-giftTips .triangle { width: 35px; height: 19px; background: rgba(0, 0, 0, 0) url("tips_triangle.png") no-repeat scroll 0% 0%; position: absolute; margin-left: -14px; left: 50%; bottom: -19px; }
.m-giftTips .t { font-size: 24px; padding-top: 21px; margin-left: 31px; margin-bottom: 11px; }
.m-giftTips .p1 { margin-left: 31px; }
.m-giftTips .item { width: 75px; margin-left: 31px; margin-top: 20px; }
.m-giftTips .item .imgCnt { width: 75px; height: 75px; background: rgba(0, 0, 0, 0) url("award_bg.png") no-repeat scroll 0% 0%; }
.m-giftTips .item .name { width: 120px; text-align: center; margin-left: -22px; color: rgb(189, 167, 101); font-size: 14px; margin-top: 5px; }
.u-sanshi .category { display: inline-block; width: 41px; height: 20px; background: rgba(0, 0, 0, 0) url("sanshi.png") no-repeat scroll 0% 0%; line-height: 20px; color: rgb(255, 255, 255); text-indent: 5px; margin-left: 8px; margin-right: 10px; }
.u-sanshi .newtitle { font-weight: 700; }
.ml10 { margin-left: 10px; }
.m5 { width: 100%; height: auto; overflow: hidden; padding-top: 170px; padding-bottom: 110px; background: rgba(0, 0, 0, 0) url("foot.jpg") no-repeat scroll center bottom; z-index: 999999; }
.m3 { width: 100%; height: auto; overflow: hidden; position: relative; z-index: 180; }
.zb_top { width: 1252px; height: 115px; margin: 10px auto 0px; background: rgba(0, 0, 0, 0) url("zb01.png") no-repeat scroll center center; line-height: 60px; color: rgb(255, 255, 255); text-align: center; font-size: 22px; font-weight: bold; }
.zb_foot { width: 1252px; height: 153px; margin: -114px auto 0px; background: rgba(0, 0, 0, 0) url("zb03.png") no-repeat scroll center center; }
.zb { width: 1167px; height: auto; overflow: hidden; margin: -78px auto 0px; padding: 0px 42px 0px 43px; background: rgba(0, 0, 0, 0) url("zb02.png") repeat-y scroll center top; }
.zb_3 { width: 378px; height: auto; overflow: hidden; float: left; background: rgb(0, 0, 0) none repeat scroll 0% 0%; position: relative; border: 2px solid rgb(88, 68, 57); z-index: 999999999; }
.zb_3_t { width: 378px; height: 47px; float: left; background: rgb(255, 251, 248) url("icon_jpg_d03297f.jpg") no-repeat scroll 0% 0%; line-height: 47px; color: rgb(61, 42, 19); text-align: center; font-size: 22px; font-weight: bold; border-bottom: 4px solid rgb(137, 41, 10); }
.zb_3_d { width: 378px; height: 2px; float: left; background: rgb(137, 41, 10) none repeat scroll 0% 0%; position: relative; }
.zb_3 .role-itemst { width: 378px; height: auto; float: left; position: relative; }
.zb_3 .role-itemst img { width: 378px; height: auto; overflow: hidden; display: block; transition: all 0.5s ease 0s; }
.zb_3 .role-itemst img:hover { width: 378px; height: auto; transition: all 0.5s ease 0s; padding: 0px; }
.zb_2 { width: 574px; height: auto; overflow: hidden; float: left; background: rgb(0, 0, 0) none repeat scroll 0% 0%; border: 2px solid rgb(88, 68, 57); }
.zb_2_t { width: 604px; height: 47px; float: left; background: rgb(255, 251, 248) url("icon_jpg_d03297f.jpg") no-repeat scroll 0% 0%; line-height: 47px; color: rgb(61, 42, 19); text-align: center; font-size: 22px; font-weight: bold; border-bottom: 4px solid rgb(137, 41, 10); }
.zb_2_d { width: 604px; height: 2px; float: left; background: rgb(137, 41, 10) none repeat scroll 0% 0%; position: relative; }
.zb_2 .role-itemst { width: 604px; height: auto; float: left; position: relative; }
.zb_2 .role-itemst img { width: 604px; height: auto; overflow: hidden; display: block; transition: all 0.5s ease 0s; }
.zb_2 .role-itemst img:hover { width: 604px; height: auto; transition: all 0.5s ease 0s; padding: 0px; }
.zb_1 { height: auto; margin-left: 70px; overflow: hidden; float: left; background: rgb(0, 0, 0) none repeat scroll 0% 0%; border: 2px solid rgb(88, 68, 57); }
.zb_1_t { width: 1167px; height: 47px; float: left; background: rgb(255, 251, 248) url("icon_jpg_d03297f.jpg") no-repeat scroll 0% 0%; line-height: 47px; color: rgb(61, 42, 19); text-align: center; font-size: 22px; font-weight: bold; border-bottom: 4px solid rgb(137, 41, 10); }
.zb_1_d { width: 1024px; height: 2px; float: left; background: rgb(137, 41, 10) none repeat scroll 0% 0%; position: relative; }
.zb_1 .role-itemst { width: 1024px; height: auto; float: left; position: relative; }
.zb_1 .role-itemst img { width: 1024px; height: auto; overflow: hidden; display: block; transition: all 0.5s ease 0s; }
.zb_1 .role-itemst img:hover { width: 1024px; height: auto; transition: all 0.5s ease 0s; padding: 0px; }