@charset "UTF-8";
/**
 * create by syGuo on 2017/9/19
 */

 /*CSS reset*/
body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, button, p { margin:0; padding:0; }
ol, ul { list-style:none; }
:link, :visited { text-decoration:none; }
body { color: #333; font-family:"Microsoft YaHei",sans-serif,Arial; }
a:hover { text-decoration: none; }
img { border: 0;}
.hidden { display:none; }
.fl { float:left; }
.fr { float:right; }
.clearFix:after { content:"\200B"; display:block; height:0; clear:both; }
.clearFix { *zoom:1; }

body{ background:#fdfdfd url("../images/banner.jpg") center top no-repeat; }

#top-logbar{ background-color: #242525;}

.petal{ position: absolute;top: 3180px;left: 0;display: block;width: 176px;height: 214px;background: url("../images/petal-1.png") center top no-repeat;}
.petal-2{ top: 4080px;left: 140px;width: 246px;height: 161px;background-image: url("../images/petal-2.png");}
.petal-3{ top: 4370px;left: auto;right: 0;width: 241px;height: 265px;background-image: url("../images/petal-3.png");}

.zmq-header{ position: relative;height: 1125px;margin-bottom: -221px;overflow: hidden;}
.zmq-header video{ position: absolute;top: -35px;left: 50%;width: 1920px;height: 1160px;margin-left: -960px;z-index: -1;}
.zmq-header .video-btn{ position: absolute;top: 611px;left: 50%;display: block;width: 80px;height: 80px;margin-left: -20px;background: url("../images/video-btn.png") center top no-repeat;}
.zmq-header .video-btn:hover{ opacity: .8;}
.zmq-header .zmq-download{ position: absolute;top: 738px;left: 50%;width: 214px;height: 143px;padding-left: 151px;margin-left: -185px;}
.zmq-header .zmq-download img{ position: absolute;top: 0;left: 0;display: block;width: 142px;height: 142px;}
.zmq-header .zmq-download a{ display: block;width: 100%;height: 68px;background: url("../images/download-btn.png") center top no-repeat;}
.zmq-header .zmq-download a:hover{ opacity: .9;}
.zmq-header .zmq-download .app-download{ margin-bottom: 9px;}
.zmq-header .zmq-download .android-download{ background-position: center bottom;}

.zmq-preface{ position: relative;width: 902px;margin: 0 auto;height: 80px;padding-left: 98px;z-index: 1;}
.zmq-preface i{ position: absolute;top: 0;left: 0;display: block;width: 80px;height: 100%;background: url("../images/preface-tit.png") center top no-repeat;}
.zmq-preface p{ height: 80px;width: 100%;font-size: 16px;line-height: 26px;color: #333;}

.zmq-video{ position: relative;height: 513px;padding-top: 196px;margin-top: -98px;margin-bottom: -30px;background: url("../images/bg1.png") center top no-repeat;}
.zmq-video .video-content{ width: 640px;margin: 0 auto;height: 360px;padding: 0 27px 0 333px;}

.zmq-tit{ width: 1000px;height: 133px;margin: 0 auto 48px;background: url("../images/title-bg.png") center top no-repeat;}
.zmq-tit h2{ display: none;}

.zmq-role{ height: 1180px;margin-bottom: -220px;background: url("../images/bg2.png") center bottom no-repeat;}
.zmq-role .role-content{ position: relative;width: 500px;margin: 0 auto;padding-right: 500px;}
.zmq-role .role-content img{ display: block;width: 467px;height: 655px;}
.zmq-role .role-content .role-introduction{ position: absolute;top: 0;left: 310px;display: block;width: 122px;height: 41px;background: url("../images/role-introduction.png") center top no-repeat;}
.zmq-role .role-content .role-introduction:hover{ background-position: center bottom;}
.zmq-role .role-content .role-video-btn{ position: absolute;top: 534px;left: 785px;display: block;width: 110px;height: 105px;background: url("../images/video-btn-con.png") center top no-repeat;}
.zmq-role .role-content .role-video-btn:hover{ background-position: center bottom;}

.zmq-home{ position: relative;padding-bottom: 68px;}
.zmq-home .zmq-tit{ background-position: center -140px;margin-bottom: 30px;}
.zmq-home .home-content{ width: 1000px;margin: 0 auto;overflow: hidden;}
.zmq-home .home-content .home-tab{ width: 1015px;height: 66px;overflow: hidden;font-size: 0;margin-bottom: 25px;}
.zmq-home .home-content .home-tab li{ display: inline-block;width: 238px;height: 100%;margin-right: 15px;background: url("../images/tab-tit1.png") center top no-repeat;cursor: pointer;font-size: 24px;color: #5b5b67;line-height: 66px;text-align: center;}
.zmq-home .home-content .home-tab li.active{ background-position: center bottom;color: #fff;}
.zmq-home .home-content .home-tab-content{ position: relative;width: 100%;height: 550px;}
.zmq-home .home-content .home-tab-content .home-tab-list{ position: absolute;top: 0;left: 0;width: 100%;height: 550px;visibility: hidden;}
.zmq-home .home-content .home-tab-content .home-tab-list.active{ visibility: visible;z-index: 1;}
.zmq-home .home-content .home-tab-content .home-view{ position: relative;width: 100%;overflow: hidden;}
.zmq-home .home-content .home-tab-content .home-view .home-item-img{ width: 562px;height: 374px;padding: 30px;margin: 0 auto;background: url("../images/images-border1.png") center top no-repeat;}
.zmq-home .home-content .home-tab-content .home-view .home-item-img img{ display: block;width: 100%;height: 100%;}
.zmq-home .home-content .home-tab-content .home-view .home-item-word{ height: 78px;width: 100%;padding-top: 13px;margin-top: 23px;border-top: 1px dashed #979797;font-size: 16px;color: #888;line-height: 26px;overflow: auto;}
.zmq-home .home-content .home-tab-content .home-view .home-item-word p{ text-indent: 2em;}
.zmq-home .home-content .home-tab-content .home-view .sPrev,
.zmq-home .home-content .home-tab-content .home-view .sNext{ position: absolute;top: 195px;display: block;width: 41px;height: 79px;background: url("../images/swiper-arr1.png") left top no-repeat;}
.zmq-home .home-content .home-tab-content .home-view .sPrev:hover,
.zmq-home .home-content .home-tab-content .home-view .sNext:hover{ opacity: .9;}
.zmq-home .home-content .home-tab-content .home-view .sPrev{ left: 90px;}
.zmq-home .home-content .home-tab-content .home-view .sNext{ right: 90px;background-position: right top;}

.zmq-play{ position: relative;height: 854px;background: url("../images/bg3.png") center top no-repeat;}
.zmq-play .zmq-tit{ background-position: center -280px;margin-bottom: 8px;}
.zmq-play .play-content{ width: 924px;height: 630px;padding: 40px 38px 0;margin: 0 auto;background: url("../images/scroll-bg.png") center top no-repeat;}
.zmq-play .play-content ul{ width: 100%;height: 417px;}
.zmq-play .play-content ul li{ float: left;position: relative;width: 0;padding-left: 69px;height: 100%;overflow: hidden;margin-left: 1px;transition: all .5s;}
.zmq-play .play-content ul li:nth-child(1){ margin-left: 0;}
.zmq-play .play-content ul li.active{ width: 715px;height: 417px;}
.zmq-play .play-content ul li i{ position: absolute;top: 0;left: 0;display: block;width: 69px;height: 100%;cursor: pointer;}
.zmq-play .play-content ul li:nth-child(1) i{ background: url("../images/scroll-tab1.png") right top no-repeat;}
.zmq-play .play-content ul li:nth-child(2) i{ background: url("../images/scroll-tab2.png") right top no-repeat;}
.zmq-play .play-content ul li:nth-child(3) i{ background: url("../images/scroll-tab3.png") right top no-repeat;}
.zmq-play .play-content ul li.active i{ background-position: left top;}
.zmq-play .play-content ul li .play-view{ position: relative;width: 715px;height: 100%;}
.zmq-play .play-content ul li .play-view img{ display: block;width: 715px;height: 417px;}
.zmq-play .play-content ul li .play-view .sPrev,
.zmq-play .play-content ul li .play-view .sNext{ position: absolute;top: 195px;display: block;width: 78px;height: 78px;background: url("../images/swiper-arr2.png") left top no-repeat;}
.zmq-play .play-content ul li .play-view .sPrev:hover,
.zmq-play .play-content ul li .play-view .sNext:hover{ opacity: .8;}
.zmq-play .play-content ul li .play-view .sPrev{ left: 10px;}
.zmq-play .play-content ul li .play-view .sNext{ right: 10px;background-position: right top;}
.zmq-play .play-content .play-word{ position: relative;width: 774px;height: 107px;margin: 53px auto 0;padding: 25px;background: url("../images/word-bg1.png") center top no-repeat;}
.zmq-play .play-content .play-word .play-word-list{ width: 100%;height: 100%;overflow: hidden;display: none;}
.zmq-play .play-content .play-word .play-word-list.active{ display: block;}
.zmq-play .play-content .play-word .play-word-list .play-word-li{ width: 100%;height: 100%;overflow: auto;display: none;}
.zmq-play .play-content .play-word .play-word-list .play-word-li.active{ display: block;}

.zmq-image{ position: relative;height: 840px;background: url("../images/bg4.png") center bottom no-repeat;}
.zmq-image .zmq-tit{ background-position: center -420px;margin-bottom: 26px;}
.zmq-image .image-content{ width: 1000px;margin: 0 auto;}
.carousel{ width: 1000px;height: 465px;overflow: hidden;position: relative;}
.carousel .slides{ overflow:hidden; position:relative; }
.carousel .slides a{ position:relative; display:block; height:100%; }
.carousel .slides i{ position:absolute; left:0; top: 0; width:100%; height:100%; background:rgba(0, 0, 0, .35); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#50000000,endcolorstr=#50000000) \9; }
.carousel .slides .slideItem{ background-color: #fff; overflow:hidden; position:absolute; cursor:pointer; opacity:1 !important; }
.carousel .slides .slideItem a{ position: relative;overflow:hidden; display:block;cursor: default; }
.carousel .slides .slideItem a:after{ position: absolute;top: 0;left: 0;display: block;width: 100%;height: 100%;background: url("../images/images-border2.png") center top no-repeat;content: '';}
.carousel .slides .slideItem img{ width:100%; height:100%; display:block; }
.carousel .slides .slideItem .cover{ background:rgb(0, 0, 0); left:0; top:0; width:100% !important; height:420px; !important; display:block; position:absolute; }
.carousel .prevButton,
.carousel .nextButton{ background:url("../images/swiper-arr2.png") left top no-repeat; top:50%; margin-top: -39px;width: 78px;height: 78px; display:block; position:absolute; z-index:99; cursor:pointer; }
.carousel .prevButton:hover,
.carousel .nextButton:hover{ background-image: url("../images/swiper-arr2-on.png");}
.carousel .prevButton{ left:55px; }
.carousel .nextButton{ right:55px; background-position:right top; }

/************
 快捷导航
 ************/
.m-side-controls{ position:fixed; top:350px; right:0; z-index:20; width:154px; }
.m-side-controls a{ display:block;width: 154px;height: 54px;font-size: 14px;color: #333;line-height: 54px;text-align: center;background: url("../images/side-bar-bg.png") center top no-repeat;cursor: pointer;}
.m-side-controls ul{ width:100%; }
.m-side-controls li{ position:relative; width:100%; height:54px;}
.m-side-controls li.active a,
.m-side-controls li:hover a{ background-position: center bottom;}

.area-footer-sub{ background-color: #404241;}
.m-footer-info p a,
.m-footer-info p{ color: #fff;}

.zmq-fixed{ position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,.5);z-index: 100;}
.zmq-fixed .zmq-fixed-close{ width: 100%;height: 100%;}
.zmq-fixed .zmq-fixed-video{ position: absolute;top: 50%;left: 50%;width: 800px;height: 500px;margin-left: -400px;margin-top: -250px;}

.zmq-fixed .zmq-fixed-introduction{ position: absolute;top: 50%;left: 50%;width: 1218px;height: 660px;margin-left: -609px;margin-top: -390px;padding-top: 120px;background: url("../images/pop-bg.png") center top no-repeat;}
.zmq-fixed .zmq-fixed-introduction .zmq-fixed-close{ display: block;width: 70px;height: 70px;position: absolute;top: 57px;right: 193px;cursor: pointer;}
.zmq-fixed .zmq-fixed-introduction .zmq-fixed-introduction-con{ height: 530px;width: 534px;margin: 0 auto;overflow: hidden;}
.zmq-fixed .zmq-fixed-introduction .zmq-fixed-introduction-con h6{ font-size: 18px;color: #f43143;line-height: 28px;text-align: center;}
.zmq-fixed .zmq-fixed-introduction .zmq-fixed-introduction-con h4{ width: 247px;height: 35px;padding: 0 25px;margin: 10px auto;background: url("../images/pop-tit.png") center top no-repeat;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;font-size: 16px;color: #5a5b73;line-height: 34px;text-align: center;}
.zmq-fixed .zmq-fixed-introduction .zmq-fixed-introduction-con p{ font-size: 16px;color: #5a5b73;line-height: 26px;text-indent: 2em;}
.zmq-fixed .zmq-fixed-introduction .zmq-fixed-introduction-con>div{ width: 100%;height: 100%;overflow: auto;}
.zmq-fixed .zmq-fixed-introduction .zmq-fixed-introduction-con .page-next{ position: absolute;bottom: 90px;left: 50%;display: block;width: 48px;height: 28px;margin-left: -30px;}
