/* @author LR */
.hide { display: none; }

.hide-text { text-indent: -9999px; }

.float-left { float: left; }

.float-right { float: right; }

.text-right { text-align: right; }

.text-center { text-align: center; }

.text-left { text-align: left; }

.index-sprite, .index-banner-1, .index-banner-2, .index-input-box, .index-popup-box, .index-qr-code-gift, .index-qr-code, .index-tittle-get-order, .index-tittle-pg3, .index-tittle-receive-gift, .index-video, .top_part .contain #forPopupVideo, .top_part .contain #forPopupVideo:hover, #section2 .cover .moreActivities .first, #section2 .cover .moreActivities .first:hover, #section2 .cover .moreActivities .first .title, #section2 .cover .moreActivities .second, #section2 .cover .moreActivities .second:hover, #getGift, #getGift .title, #getGift .content { background-image: url('../../../imgs/event/2016r/index.png'); background-repeat: no-repeat; }

.index-banner-1 { background-position: 0 -358px; }
.index-banner-1:hover, .index-banner-1.banner-1-hover { background-position: 0 0; }

.index-banner-2 { background-position: 0 -1074px; }
.index-banner-2:hover, .index-banner-2.banner-2-hover { background-position: 0 -716px; }

.index-input-box { background-position: 0 -1432px; }

.index-popup-box { background-position: 0 -1496px; }

.index-qr-code-gift { background-position: 0 -1954px; }

.index-qr-code { background-position: 0 -2112px; }

.index-tittle-get-order { background-position: 0 -2270px; }

.index-tittle-pg3 { background-position: 0 -2298px; }

.index-tittle-receive-gift { background-position: 0 -2396px; }

.index-video { background-position: 0 -2694px; }
.index-video:hover, .index-video.video-hover { background-position: 0 -2424px; }

.skill-sprite, .skill-skill-box, .skill-skill-btn-1, .skill-skill-btn-2, .skill-skill-btn-3, .skill-skill-btn-4, .skill-skill-btn-hover-1, .skill-skill-btn-hover-2, .skill-skill-btn-hover-3, .skill-skill-btn-hover-4, .skill-skill-detail-box, #section2 .cover .skill .skill-info, #section2 .cover .skill .skill-box, #section2 .cover .skill #myCarousel .carousel-indicators .indicator1, #section2 .cover .skill #myCarousel .carousel-indicators .indicator1:hover, #section2 .cover .skill #myCarousel .carousel-indicators .indicator2, #section2 .cover .skill #myCarousel .carousel-indicators .indicator2:hover, #section2 .cover .skill #myCarousel .carousel-indicators .indicator3, #section2 .cover .skill #myCarousel .carousel-indicators .indicator3:hover, #section2 .cover .skill #myCarousel .carousel-indicators .indicator4, #section2 .cover .skill #myCarousel .carousel-indicators .indicator4:hover { background-image: url('../../../imgs/event/2016r/skill.png'); background-repeat: no-repeat; }

.skill-skill-box { background-position: 0 0; }

.skill-skill-btn-1 { background-position: 0 -654px; }

.skill-skill-btn-2 { background-position: 0 -750px; }

.skill-skill-btn-3 { background-position: 0 -846px; }

.skill-skill-btn-4 { background-position: 0 -942px; }

.skill-skill-btn-hover-1 { background-position: 0 -1038px; }

.skill-skill-btn-hover-2 { background-position: 0 -1134px; }

.skill-skill-btn-hover-3 { background-position: 0 -1230px; }

.skill-skill-btn-hover-4 { background-position: 0 -1326px; }

.skill-skill-detail-box { background-position: 0 -1422px; }

.button2-sprite, .button2-btn_apk-active-n, .button2-btn_apk-hover-n, .button2-btn_apk-n, .button2-btn_apk, .button2-btn_ios, .top_part .contain .download .ios, .top_part .contain .download .ios:hover, .top_part .contain .download .ios:active, .top_part .contain .download .andriod, .top_part .contain .download .andriod:hover, .top_part .contain .download .andriod:active { background-image: url('../../../imgs/event/2016r/button2.png'); background-repeat: no-repeat; }

.button2-btn_apk-active-n { background-position: 0 0; }

.button2-btn_apk-hover-n { background-position: 0 -140px; }

.button2-btn_apk-n { background-position: 0 -280px; }

.button2-btn_apk { background-position: 0 -350px; }
.button2-btn_apk:hover, .button2-btn_apk.btn_apk-hover { background-position: 0 -210px; }
.button2-btn_apk:active, .button2-btn_apk.btn_apk-active { background-position: 0 -70px; }

.button2-btn_ios { background-position: 0 -560px; }
.button2-btn_ios:hover, .button2-btn_ios.btn_ios-hover { background-position: 0 -490px; }
.button2-btn_ios:active, .button2-btn_ios.btn_ios-active { background-position: 0 -420px; }

body { min-width: 1326px; }

.top_part { background: url("/imgs/event/2016r/bg-1.jpg") no-repeat center top; height: 1080px; width: 100%; }
.top_part .contain { position: relative; width: 1326px; margin: 0 auto; height: 1080px; }
.top_part .contain .center_bg { position: absolute; top: 0; background: url("/imgs/event/2016r/bg-1-main.jpg") no-repeat center top; height: 583px; width: 1326px; }
.top_part .contain #forPopupVideo { position: absolute; background-position: 0 -2694px; width: 456px; height: 270px; top: 380px; left: 190px; }
.top_part .contain #forPopupVideo:hover, .top_part .contain #forPopupVideo.video-hover { background-position: 0 -2424px; }
.top_part .contain #forPopupVideo:hover { background-position: 0 -2424px; width: 456px; height: 270px; }
.top_part .contain .download { width: 456px; height: 150px; position: absolute; top: 680px; left: 190px; }
.top_part .contain .download .Qcode { position: absolute; background: url("/imgs/event/2016r/download.png") no-repeat center top; width: 152px; height: 158px; top: 0; left: 0; }
.top_part .contain .download .ios { position: absolute; background-position: 0 -560px; width: 292px; height: 70px; top: 0; right: 0; }
.top_part .contain .download .ios:hover, .top_part .contain .download .ios.btn_ios-hover { background-position: 0 -490px; }
.top_part .contain .download .ios:active, .top_part .contain .download .ios.btn_ios-active { background-position: 0 -420px; }
.top_part .contain .download .ios:hover { background-position: 0 -490px; }
.top_part .contain .download .ios:active { background-position: 0 -420px; }
.top_part .contain .download .andriod { position: absolute; background-position: 0 -280px; width: 292px; height: 70px; bottom: 0; right: 0; }
.top_part .contain .download .andriod:hover { background-position: 0 -140px; }
.top_part .contain .download .andriod:active { background-position: 0 0; }

#section2 { position: relative; width: 100%; height: 2122px; background: url("/imgs/event/2016r/bg-2.jpg") no-repeat center 0; }
#section2 .cover { width: 1300px; margin: 0 auto; position: relative; }
#section2 .cover .skill { width: 100%; height: 700px; position: relative; top: 160px; }
#section2 .cover .skill .skill-info { position: absolute; left: 30px; background-position: 0 -1422px; width: 728px; height: 628px; }
#section2 .cover .skill .skill-info .skill-detail { width: 530px; max-height: 300px; margin: 200px auto; font-size: 20px; color: #1fa4c9; overflow: hidden; }
#section2 .cover .skill .skill-box { position: absolute; top: 5px; right: 30px; background-position: 0 0; width: 522px; height: 654px; z-index: 2; }
#section2 .cover .skill #myCarousel { position: absolute; top: 0; left: 0; width: 1300px; height: 700px; }
#section2 .cover .skill #myCarousel .carousel-indicators { position: absolute; bottom: 30px; height: 96px; left: 78px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator { position: absolute; display: inline-block; width: 84px; height: 96px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator .skill-hover { position: absolute; top: 0; left: 0; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator1 { top: 0; left: 0; background-position: 0 -654px; width: 84px; height: 96px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator1:hover { background-position: 0 -1038px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator2 { top: 0; left: 99px; background-position: 0 -750px; width: 84px; height: 96px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator2:hover { background-position: 0 -1134px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator3 { top: 0; left: 198px; background-position: 0 -846px; width: 84px; height: 96px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator3:hover { background-position: 0 -1230px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator4 { top: 0; left: 297px; background-position: 0 -942px; width: 84px; height: 96px; }
#section2 .cover .skill #myCarousel .carousel-indicators .indicator4:hover { background-position: 0 -1326px; }
#section2 .cover .skill #myCarousel .carousel-inner { position: relative; width: 100%; height: 550px; color: #1fa4c9; }
#section2 .cover .skill #myCarousel .carousel-inner .item { position: relative; width: 100%; height: 100%; display: none; }
#section2 .cover .skill #myCarousel .carousel-inner .item .skill-title { position: absolute; width: 522px; top: 6px; right: 30px; font-size: 24px; text-align: center; }
#section2 .cover .skill #myCarousel .carousel-inner .item .info { position: absolute; width: 530px; height: 300px; font-size: 20px; top: 200px; left: 120px; }
#section2 .cover .skill #myCarousel .carousel-inner .item .info h3 { font-size: 48px; padding: 0; }
#section2 .cover .skill #myCarousel .carousel-inner .item .info .info-detail { margin: 40px 0; }
#section2 .cover .skill #myCarousel .carousel-inner .item .item-video { position: absolute; right: 50px; top: 48px; height: 500px; width: 480px; z-index: 1; }
#section2 .cover .skill #myCarousel .carousel-inner .item .item-video .general-video { height: 100%; width: 100%; }
#section2 .cover .skill #myCarousel .carousel-inner .item.active { display: block; -webkit-animation: see 1s linear forwards; animation: see 1s linear forwards; }
#section2 .cover .moreActivities { width: 684px; height: 820px; position: relative; top: 1000px; margin: 0 auto; }
#section2 .cover .moreActivities .first { position: absolute; top: 0; background-position: 0 -358px; width: 684px; height: 358px; }
#section2 .cover .moreActivities .first:hover, #section2 .cover .moreActivities .first.banner-1-hover { background-position: 0 0; }
#section2 .cover .moreActivities .first:hover { background-position: 0 0; }
#section2 .cover .moreActivities .first .title { background-position: 0 -2298px; width: 438px; height: 98px; background-color: transparent; position: absolute; top: -65px; left: -12px; }
#section2 .cover .moreActivities .second { position: absolute; bottom: 0; background-position: 0 -1074px; width: 684px; height: 358px; }
#section2 .cover .moreActivities .second:hover, #section2 .cover .moreActivities .second.banner-2-hover { background-position: 0 -716px; }
#section2 .cover .moreActivities .second:hover { background-position: 0 -716px; }
#section2 .cover .moreActivities .second .clickToGet { position: absolute; width: 684px; height: 358px; }

#getGift { display: none; position: relative; background-position: 0 -1496px; width: 684px; height: 458px; }
#getGift .title { position: absolute; background-position: 0 -2396px; width: 202px; height: 28px; top: 2px; left: 100px; }
#getGift .content { position: absolute; background-position: 0 -1954px; width: 152px; height: 158px; top: 100px; left: 267px; }
#getGift .detail { color: #ef7f1c; font-size: 28px; position: absolute; top: 280px; left: 17%; }
#getGift .know { position: absolute; background: url("/imgs/event/2016r/btn/btn_13.png") no-repeat center top; width: 292px; height: 70px; top: 350px; left: 200px; }
#getGift .know:hover { background: url("/imgs/event/2016r/btn/btn_15.png") no-repeat center top; }

#iOSDownload { padding-bottom: 0; width: 640px; color: #333333; background: #fff; border-radius: 5px; display: none; }
#iOSDownload .modal-header { height: 60px; padding: 0 24px; font-size: 24px; }
#iOSDownload .modal-header .title { line-height: 60px; float: left; }
#iOSDownload .modal-header .close { background: none; text-indent: 0; width: auto; height: auto; line-height: 24px; margin-top: 18px; color: #666; -webkit-transition: color .3s ease; transition: color .3s ease; float: right; }
#iOSDownload .modal-body { border-bottom: 1px solid #ecf0f1; border-top: 2px solid #ecf0f1; padding: 30px 24px; font-size: 14px; line-height: 26px; text-align: center; }
#iOSDownload .modal-link { padding: 20px 24px; text-align: center; }
#iOSDownload .modal-link a { color: #f60; }

#popupVideoContainer { border: 5px solid #ffffff; background: #ffffff; }
#popupVideoContainer #popupVideo { width: 848px; height: 480px; }

.fancybox-skin { background: transparent; }

@-webkit-keyframes see { from { opacity: 0; }
  to { opacity: 1; } }

@keyframes see { from { opacity: 0; }
  to { opacity: 1; } }