@charset "utf-8";
.wrap-inner{ margin: 0 auto; width: 1000px;}
.banner{ background:url(../images/20160321/banner.jpg) no-repeat center top; width: 100%; height: 365px;}
.banner .title{ text-align: center; padding-top: 73px; width: 100%; height: 75px; line-height: 75px; font-size: 50px; font-weight: 400;}
.banner .sub-title{ margin-top: 14px; width: 100%; height: 56px; line-height: 56px;}
.banner .sub-title .name{ display: block; background-color: #eac1bf; color: #fff; font-size: 32px; margin: 0 auto; border-radius: 4px; width: 334px; height: 56px;  text-align: center;}
.banner .address{ font-weight: 400; color: #4a4a4a; padding-top: 10px; font-size: 14px; height: 20px; line-height: 20px; text-align: center; width: 100%; text-align: center;}
.banner .big-title{ color: #000; padding-top: 40px; font-size: 36px; text-align: center; position: relative; font-weight: 400;}
.banner .big-title .line{ display: block; margin-left: -32px; height: 3px; width: 46px; background: #000; position: absolute; left: 50%; bottom: -12px;}
.banner .hint{ font-size: 14px; font-weight: 400; color: #9b9b9b; margin-top: 30px; width: 100%; text-align: center;}
.banner .hint i{ display: inline-block; background: url(../images/20160321/play.png) no-repeat; margin: 2px 0 0 6px; height: 16px; width: 16px; vertical-align: top;}
.module-one{ background: #fbfbfb; padding-top: 40px; width: 100%; height: 404px;}
.module-one .left-box{ float: left; height: 404px; width: 380px;}
.module-one .left-box .img-box{ width: 380px; height: 248px;}
.module-one .left-box .img-box a{ display: block;}
.module-one .left-box .img-title-info{ padding: 0 15px; height: 126px; width: 350px; vertical-align: top;}
.module-one .left-box .img-title-info .catery{ margin-top: 20px; height: 22px; width: 100%;}
.module-one .left-box .img-title-info span.catery-info{ display: inline-block; background-color: #50e3c2; border-radius: 4px; padding: 0 12px; height: 22px; line-height: 22px; font-size: 16px; color: #fff; text-align: center;}
.module-one .left-box .img-title-info .title-link{ font-size: 24px; height: 70px; width: 100%; overflow: hidden; line-height: 35px; font-weight: 400;}
.module-one .left-box .img-title-info .title-link a{ color: #262626;}
.module-one .left-box .img-title-info .title-link a:hover{ color: #d0021b;}
.module-one .left-box .img-title-info .bar-info{ margin-top: 10px; height: 20px; line-height: 20px; color: #999; font-size: 12px;}
.module-one .left-box .img-title-info .comment-num{ display: inline-block; background: url(../images/20160321/comment-icon.png) no-repeat 0 4px; padding-left: 20px; vertical-align: top;}
.module-one .left-box .img-title-info .view-num{ display: inline-block; background: url(../images/20160321/view-icon.png) no-repeat 0 4px; margin-left: 20px; padding-left: 20px; vertical-align: top;}
.module-one .right-box{ display: inline; float: left; margin-left: 20px; height: 404px; width: 600px; overflow: hidden; position: relative;}
.module-one .right-box ul{ height: 404px; position: absolute; width: 300%; top: 0; left: 0;}
.module-one .right-box ul li{ float: left; height: 404px; width: 600px; position: relative;}
.module-one .right-box .img{ display: block; height: 404px; width: 600px; overflow: hidden;}
.module-one .right-box .catery{ display: block; opacity: 0; background-color: #f5a623; color: #fff; line-height: 22px; padding: 0 12px; text-align: center; border-radius: 4px; position: absolute; left: 36px; top: 94px; z-index:10;}
.module-one .right-box .img-title{ color: #fff; opacity: 0; line-height: 40px; font-size: 32px; width: 400px; height: 82px; overflow: hidden; position: absolute; left: 32px; top: 131px; z-index:10;}
.module-one .right-box .sub-info{ opacity:0; height: 72px; width: 400px; overflow: hidden; color: #fff; line-height: 24px; font-size: 16px; position: absolute; left: 32px; top: 224px; z-index:10;}
.module-one .right-box .toggle{ height: 10px; width: 100%; position: absolute; bottom: 24px; text-align: right; z-index:10;}
.module-one .right-box .toggle a{ display: inline-block; background-color: #d8d8d8; border-radius: 10px; margin-right: 8px; height: 10px; width: 10px; font-size: 0;text-indent: -999em;}
.module-one .right-box .toggle a.active{ background-color: #d0021b;}
.module-one .right-box ul li .mask_bg{ background: url(../images/20160321/fancybox_overlay.png) repeat; height: 100%; width: 100%; position: absolute; left: 0; top: 0; z-index: 5;}


.module-two{ background: #fbfbfb; padding: 21px 0; width: 100%;}
.module-two .we-ad{ background-color: #f6d3bf; margin: 0 auto; height: 90px;  width: 1000px; overflow: hidden;}

.module-three{ background-color: #f5f5f5; height: 635px; width: 100%;}
.common-title{ color: #000; line-height: 50px; margin-bottom: 40px; padding-top: 26px; font-weight: 400; height: 50px; font-size: 34px; width: 100%; text-align: center; position: relative;}
.common-title .line{display: block;margin-left: -23px;height: 3px;width: 46px;background: #000;position: absolute;left: 50%;bottom: -8px;}
.common-area{ height: 470px; width: 100%; overflow: hidden;}
.common-area .big-img{ float: left; width: 480px; height: 470px; overflow: hidden; position: relative;}
.common-area .big-img .title{ background: url(../images/20160321/title-bg.png) repeat; font-weight: 400; font-size: 22px; color: #fff; line-height: 66px; height: 66px; width: 454px; padding:0 13px; color: #fff; position: absolute; left: 0; bottom: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.common-area .big-img:hover .title{ color: #d0021b;}
.common-area .list-area{ display: inline; float: left; margin-left: 20px; width: 500px;}
.common-area .list-area ul{ margin-top: -25px;}
.common-area .list-area ul li{ margin:25px 0; height: 140px; padding-left: 213px; width: 287px; overflow: hidden; position: relative;}
.common-area .list-area ul li .img-box{ display: block; height: 140px; width: 198px; position: absolute; left: 0; top: 0;}
.common-area .list-area ul li .title{ font-weight: 400; margin-bottom: 12px; height: 70px; font-size: 23px; line-height: 35px; width: 286px; overflow: hidden; word-break: break-all; word-wrap: break-word;}
.common-area .list-area ul li .title a{ float: left; color: #333; height: 100%;}
.common-area .list-area ul li .title a:hover{ color: #d0021b;}
.common-area .list-area ul li .info{ color: #878787; font-size: 14px; height: 48px; line-height: 24px; width: 286px; overflow: hidden; word-break: break-all; word-wrap: break-word;}
.common-area .list-area ul li.mid{ margin: 25px 0;}

.module-four{ background-color: #fff; height: 635px; width: 100%;}

.module-five{ background-color: #f5f5f5; height: 470px; width: 100%;}
.module-five ul{ margin-left: -2px; position: relative;}
.module-five ul li{ display: inline; float: left; background-color: #fff; margin-left: 2px; height: 314px; width: 248px; overflow: hidden;}
.module-five ul li .img-box{ display: block; height: 186px; width: 248px; overflow: hidden;}
.module-five ul li .title-info{ height: 98px; padding:15px 13px; width: 222px; overflow: hidden;}
.module-five ul li .title-info .atitle{ display: block; color: #262626; width: 100%; line-height: 28px; height: 56px; font-size: 18px; word-wrap: break-word; word-break: break-all; overflow: hidden; text-align: center;}
.module-five ul li .title-info .atitle:hover{ color: #d0021b;}
.module-five ul li .title-info .bar-info{ margin-top: 10px; height: 20px; line-height: 20px; color: #999; font-size: 12px; text-align: center;}
.module-five ul li .title-info .comment-num{ display: inline-block; background: url(../images/20160321/comment-icon.png) no-repeat 0 4px; padding-left: 20px; vertical-align: top;}
.module-five ul li .title-info .view-num{ display: inline-block; background: url(../images/20160321/view-icon.png) no-repeat 0 4px; margin-left: 20px; padding-left: 20px; vertical-align: top;}

.module-six{ background-color: #fbfbfb; height: 670px; width: 100%;}
.module-six .top-box{ height: 320px; width: 100%;}
.module-six .top-box ul li{ display: inline; float: left; height: 140px; padding-left: 213px; width: 287px; margin-bottom: 20px; position: relative;}
.module-six .top-box ul li .img{ display: block; height: 140px; width: 198px; position: absolute; left: 0; top: 0;}
.module-six .top-box ul li .title {font-weight:400;margin-bottom: 24px;height: 60px;font-size: 20px;line-height: 28px;width: 286px;overflow: hidden;word-break: break-all;word-wrap: break-word;}
.module-six .top-box ul li .title a {float: left;color: #333;height: 100%;}
.module-six .top-box ul li .title a:hover{ color: #d0021b;}
.module-six .top-box ul li .info {color: #878787;font-size: 14px;height: 48px;line-height: 24px;width: 286px;overflow: hidden;word-break: break-all;word-wrap: break-word;}
.module-six .bottom-box{ height: 186px; width: 100%;}
.module-six .bottom-box ul{ margin-left: -4px; position: relative;}
.module-six .bottom-box ul li{ display: inline; float: left; margin-left: 3px; height: 186px; width: 248px; position: relative;}
.module-six .bottom-box ul li a{ display: block; max-width: 248px; max-height: 186px;}
.module-six .bottom-box ul li .news-title{ background: url(../images/20160321/title-bg.png) repeat; color: #fff; font-weight: 400; font-size: 16px; line-height: 25px; height: 50px; width: 222px; padding:9px 13px; position: absolute; left: 0; bottom: 0; overflow: hidden; word-wrap: break-word; word-break: break-all;}
.module-six .bottom-box ul li a:hover .news-title{ color: #d0021b;}

.module-serven{ background-color: #f5f5f5; height: 470px; width: 100%;}
.module-serven .inner-html{ height: 314px; width: 100%;}
.module-serven .inner-html .left-box{ float: left; width: 498px; height: 314px; position: relative; overflow: hidden;}
.module-serven .inner-html .left-box .title-name{ background: url(../images/20160321/title-bg.png) repeat; color: #fff; font-size: 24px; line-height: 50px; font-weight: 400; height: 50px; padding:0 11px; width: 476px; overflow: hidden;  text-overflow: ellipsis; white-space: nowrap; position: absolute; left: 0;bottom: 0;}
.module-serven .inner-html .left-box:hover .title-name{ color: #d0021b;}
.module-serven .inner-html .right-box{ float: left; height: 314px;}
.module-serven .inner-html ul li{ display: inline; float: left; background-color: #fff; margin-left: 2px; height: 314px; width: 248px; overflow: hidden;}
.module-serven .inner-html ul li .img-box{ display: block; height: 186px; width: 248px; overflow: hidden;}
.module-serven .inner-html ul li .title-info{ height: 98px; padding:15px 13px; width: 222px; overflow: hidden;}
.module-serven .inner-html ul li .title-info .atitle{ display: block; color: #262626; width: 100%; line-height: 28px; height: 56px; font-size: 18px; word-wrap: break-word; word-break: break-all; overflow: hidden; text-align: center;}
.module-serven .inner-html ul li .title-info .atitle:hover{ color: #d0021b;}
.module-serven .inner-html ul li .title-info .bar-info{ margin-top: 10px; height: 20px; line-height: 20px; color: #999; font-size: 12px; text-align: center;}
.module-serven .inner-html ul li .title-info .comment-num{ display: inline-block; background: url(../images/20160321/comment-icon.png) no-repeat 0 4px; padding-left: 20px; vertical-align: top;}
.module-serven .inner-html ul li .title-info .view-num{ display: inline-block; background: url(../images/20160321/view-icon.png) no-repeat 0 4px; margin-left: 20px; padding-left: 20px; vertical-align: top;}

.module-eight{ background-color: #fbfbfb; height: 700px; width: 100%;}
.module-eight .area{ height: 276px; width: 100%;}
.module-eight .area .b-img{ float: left; height: 275px; width: 498px;}
.module-eight .area .list-box{ float: left; height: 275px; width: 502px;}
.module-eight .area .list-box ul{ position: relative; margin-top: -2px;}
.module-eight .area .list-box ul li{ display: inline; float: left; margin: 2px 0 0 2px; width: 248px; height: 137px;}

.module-nine{ background-color: #f5f5f5; width: 100%; height: 400px;}
.module-nine .topic-list{ height: 258px; width: 100%;}
.module-nine .topic-list ul{ margin-left: -4px; position: relative;}
.module-nine .topic-list ul li{ display: inline; float: left; margin-left: 3px; height: 258px; width: 248px;}
.module-nine .topic-list ul li a{ display: block; height: 100%; width: 100%;}
.module-nine .topic-list ul li .img{ height: 186px; width: 248px;}
.module-nine .topic-list ul li .title{ color: #262626; font-size: 18px; height: 60px; margin-top: 10px; padding:5px 13px; width: 222px; text-align: center; line-height: 25px;}
.module-nine .topic-list ul li a:hover .title{ color: #d0021b;}

.module-ten{ background-color: #fbfbfb; width: 100%; }

.fixedBackTop{ display:none; float:right; background:url(../images/20160321/backTopBtn.png) no-repeat; margin-left:520px; height:50px; width:50px; position:fixed; bottom:120px; left:50%; z-index:999; text-indent:-999em; _background: url(../images/wwdc2015/backTopBtn.png) no-repeat; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=noscale, src="backTopBtn.png"); -moz-transition:all .32s linear; -ms-transition:all .32s linear; -webkit-transition:all .32s linear; transition:all .32s linear;}
.fixedBackTop:hover{ background:url(../images/20160321/backTopBtn_hover.png) no-repeat;}
