.index-banner { width: 100%; height: 959px; overflow: hidden; position: relative; }
.index-banner .imgs { }
.index-banner .imgs .img { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-position: center; }
.index-banner .text { width: 600px; position: absolute; left: 140px; top: 190px; font-family: '宋体'; color: #4a4a4a; }
.index-banner .text p { position: relative; top: 50px; line-height: 1; opacity: 0; filter: alpha(opacity=0); }
.index-banner .text .p1 span { width: 150px; height: 42px; line-height: 42px; text-align: center; background: #b69265; border-radius: 15px; font-size: 30px; color: #fee5c5; display: inline-block; }
.index-banner .text .p2 { font-size: 60px; color: #d70c19; padding: 10px 0 30px 0; font-family: '微软雅黑'; }
.index-banner .text .p3 { font-size: 22px; color: #4a4a4a; font-weight: bold; }
.index-banner .text .p4 { padding: 5px 0 70px 0; color: #4a4a4a; line-height: 18px; }
.index-banner .text .p5 a { color: #fff; font-size: 14px; font-family: '微软雅黑'; transition: .3s; }
.index-banner .text .p5 a:after { content: '>'; font-weight: bold; font-family: '宋体'; }
.index-banner .text .p5 a:hover { color: #d70c19; }
.index-banner .scroll-tip { width: 60px; height: 50px; text-align: center; font-size: 14px; color: #48480f; font-weight: bold; position: absolute; left: 50%; bottom: 20px; margin: 0 0 0 -30px; background: url(../images/icon-ar.png) no-repeat center bottom; animation: tip 1.4s linear infinite; }


@keyframes tip {
    0% { background-position-y: bottom; }
    15% { background-position-y: 30px; }
    30% { background-position-y: bottom; }
    100% { background-position-y: bottom; }
}

@-webkit-keyframes tip {
    0% { background-position-y: bottom; }
    15% { background-position-y: 30px; }
    30% { background-position-y: bottom; }
    100% { background-position-y: bottom; }
}

.banners { position: relative; overflow: hidden; }
.banners .bannerbox li { height: 100%; line-height: 0; opacity: 0; transition: opacity 1000ms linear; -webkit-transition: opacity 1000ms linear; float: left; }
.banners .bannerbox li .bimg { line-height: 0; width: 100%; position: relative; transition: transform 5s ease; -webkit-transition: transform 5s ease; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); }
.banners .bannerbox li.imgIn { opacity: 1; z-index: 10; display: block; }
.banners .bannerbox li.imgIn .bimg { transform: matrix(1.1, 0, 0, 1.1, 0, 0); -webkit-transform: matrix(1.1, 0, 0, 1.1, 0, 0); }
.btext { position: absolute; left: 13.125%; top: 28.3%; }
.btext img { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; }
.banners .bannerbox li.imgIn .btext img { -webkit-animation: flipInX .8s .2s ease-in-out both; -moz-animation: flipInX .8s .2s ease-in-out both; -ms-animation: flipInX .8s .2s ease-in-out both; animation: flipInX .8s .2s ease-in-out both; }
.banners .bannerbox li.imgIn .text p { top: 0; opacity: 1; filter: alpha(opacity=100); transition: .7s .2s; }
.banners .bannerbox li.imgIn .text .p2 { transition: .7s .3s; }
.banners .bannerbox li.imgIn .text .p3 { transition: .7s .4s; }
.banners .bannerbox li.imgIn .text .p4 { transition: .7s .5s; }
.banners .bannerbox li.imgIn .text .p5 { transition: .7s .6s; }
.banners .bannerbox li.white .text .p2, .banners .bannerbox li.white .text .p3 { color: #fff; }


.num { position: absolute; }
.num .cur { margin-right: 16px; }
.muble { position: absolute; left: 140px; bottom: 55px; z-index: 20; }
.muble b, .muble i { display: inline-block; float: left; font-size: 14px; color: #fff; font-family: "Arial"; }
.muble i { margin: 0 4px; }
.no-canvas { float: left; display: none; }
.loading canvas { width: 50px !important; height: 50px !important; }
.numbles { position: relative; float: left; cursor: pointer; }
.flex-pause { display: block; z-index: 40; width: 16px; height: 12px; background: url(../images/icon-stop.png) no-repeat center; position: absolute; left: 156px; bottom: 72px; text-indent: 888px; overflow: hidden; }
.flex-play { display: block; z-index: 40; width: 16px; height: 12px; position: absolute; left: 156px; bottom: 74px; text-indent: 888px; overflow: hidden; background: url(../images/icon-play.png) center no-repeat; }

.banners .flex-direction-nav li a { display: block; width: 7px; height: 13px; text-indent: 999px; overflow: hidden; position: absolute; bottom: 69px; z-index: 40; }
.banners .flex-direction-nav li a.flex-prev { background: url(../images/prev.png) center no-repeat; right: 106px; }
.banners .flex-direction-nav li a.flex-next { background: url(../images/next.png) center no-repeat; right: 71px; }

@-webkit-keyframes flipInX {
    0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; }
    40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); }
    70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); }
    100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; }
}

.banners .flex-control-nav { width: 100%; text-align: center; position: absolute; left: 0; bottom: 20px; z-index: 40; }
.banners .flex-control-nav li { display: inline-block; }
.banners .flex-control-nav li a span { width: 10px; height: 10px; background: #fff; border-radius: 50%; display: inline-block; margin: 0 6px; cursor: pointer; transition: .3s; text-indent: 9999px; overflow: hidden; }
.banners .flex-control-nav li a.flex-active span { background: #c2111d; }

.index-banner .loading { width: 50px; height: 50px; position: absolute; left: 140px; bottom: 55px; z-index: 5; }
.index-banner .loading .num { width: 100%; text-align: center; position: absolute; left: 0; top: 50%; margin: -4px 0 0 0; font-size: 14px; color: #646464; line-height: 12px; }
.index-banner .loading .s { width: 16px; height: 12px; display: inline-block; background: url(../images/icon-stop.png) no-repeat center; transition: .3s; }
.index-banner .stop-loading .s { background-image: url(../images/icon-play.png); }
.index-banner .btns { width: 100%; text-align: center; position: absolute; left: 0; bottom: 20px; }
.index-banner .btns span { width: 10px; height: 10px; background: #fff; border-radius: 50%; display: inline-block; margin: 0 6px; cursor: pointer; transition: .3s; }
.index-banner .btns .cur { background: #c2111d; }
.no-canvas { display: none; }
#index { width: 1600px; overflow: hidden; margin: 80px auto; }
#index .row1 { overflow: hidden; }
#index .news { width: 60%; height: 406px; float: left; background: #fff; }
#index .news dl { margin: 40px 35px 0 35px; }
#index .news dt { height: 50px; line-height: 50px; margin: 0 0 25px 0; font-size: 18px; color: #666666; border-top: 2px solid #999999; }
#index .news dt .more { width: 90px; height: 100%; background: url(../images/more.jpg) no-repeat center; float: right; }
#index .news dd { height: 200px; position: relative; overflow: hidden; }
#index .news ul { width: 9999px; position: absolute; left: 0; top: 0; }
#index .news li { width: 890px; font-size: 18px; float: left; }
#index .news li a { display: block; }
#index .news .text { margin: 0 40px 0 358px; height: 100%; overflow: hidden; }
#index .news .img { width: 323px; height: 196px; float: left; overflow: hidden; }
#index .news .img img { width: 100%; height: 100%; transition: .8s; }
#index .news .time { margin: 5px 0 0 0; padding: 0 0 0 22px; color: #7b7b7b; background: url(../images/icon-time.png) no-repeat 0 -23px; transition: .3s; }
#index .news .title { color: #333333; padding: 20px 0 30px 0; line-height: 28px; }
#index .news .cont { line-height: 24px; font-size: 14px; color: #7b7b7b; }
#index .news li a:hover .time { background-position: 0 3px; color: #bb342e; }
#index .news li a:hover .title { color: #bb342e; }
#index .news li a:hover .img img { transform: scale(1.1); -webkit-transform: scale(1.1); }
#index .news .btns { margin: 45px 0 0 35px; }
#index .news .btns span { width: 12px; height: 12px; display: inline-block; background: #d2d2d2; border-radius: 50%; float: left; margin: 0 10px 0 0; cursor: pointer; }
#index .news .btns .cur { background: #bb342e; }
#index .video { width: 38%; float: right; height: 406px; position: relative; }
#index .video .img { width: 100%; height: 100%; background-position: center; background-size: cover; }
#index .video .play { position: absolute; left: 50%; top: 50%; margin: -32px 0 0 -32px; }
#index .row2 { padding: 70px 0 60px 0; line-height: 26px; text-align: center; font-size: 14px; color: #fff; margin: 25px 0; overflow: hidden; background: url(../images/index-about-bg.jpg) repeat; }
#index .row2 .text { padding: 40px 0 50px 0; }
#index .row2 .more { width: 200px; height: 52px; line-height: 52px; text-align: center; font-size: 14px; color: #fff; display: inline-block; text-transform: uppercase; border-radius: 50px; border: 2px solid #f3d3d5; transition: .4s; }
#index .row2 .more:hover { background: #fff; color: #bd111c; border-color: #bd111c; }
#index .row3 { overflow: hidden; margin: 25px 0 0 0; background: #fff url(../images/index-r3-bg.jpg) no-repeat left bottom; }
#index .row3 .l { width: 50%; float: left; }
#index .row3 .r { width: 50%; float: left; }
#index .row3 .l .top { height: 200px; background: #ca121e; }
#index .row3 .l .top img { margin: 35px 0 0 45px; }
#index .row3 .l .m { max-height: 690px; position: relative; }
#index .row3 .l .m .text { width: 505px; height: 280px; background: #fff; position: absolute; right: 0px; top: 158px; z-index: 1; display: none; }
#index .row3 .l .brand-title { position: absolute; left: 65px; top: 48px; }
#index .row3 .l .cont { width: 292px; position: absolute; left: 170px; top: 84px; font-size: 14px; line-height: 26px; color: #666666; }
#index .row3 .l .more { width: 122px; height: 30px; line-height: 30px; margin: 20px 0 0 0; text-align: center; color: #666666; border: 2px solid #c1c1c1; display: inline-block; border-radius: 25px; transition: .3s; }
#index .row3 .l .more:hover { background: #c2111d; color: #fff; border-color: #c2111d; }
#index .row3 .r .top { height: 200px; background: #333333; }
#index .row3 .r .top ul { height: 100%; }
#index .row3 .r .top li { width: 21%; padding: 0 2%; height: 100%; float: left; position: relative; background: url(../images/index-r3-title-bg2.png) no-repeat center 54px; transition: .5s; }
#index .row3 .r .top li:after { content: ''; width: 0; height: 5px; overflow: hidden; background: #bd7c30; position: absolute; left: 50%; bottom: 0; transition: .5s; }
#index .row3 .r .top a { width: 100%; height: 100%; display: inline-block; }
#index .row3 .r .top .cur, #index .row3 .r .top li:hover { background-image: url(../images/index-r3-title-bg.png); }
#index .row3 .r .top .cur:after { width: 100%; left: 0; }
#index .row3 .r .top .li1 a { background: url(../images/index-r3-title1.png) no-repeat center; }
#index .row3 .r .top .li2 a { background: url(../images/index-r3-title2.png) no-repeat center; }
#index .row3 .r .top .li3 a { background: url(../images/index-r3-title3.png) no-repeat center; }
#index .row3 .r .top .li4 a { background: url(../images/index-r3-title4.png) no-repeat center; }
#index .row3 .r .m { max-height: 690px; position: relative; background: url(../images/index-about-bg.jpg) repeat; }
#index .row3 .r .btn { width: 40px; height: 62px; background: #fff url(../images/icon-ar2.jpg) no-repeat 10px center; position: absolute; right: -10px; top: 50%; margin: -31px 0 0 0; transition: .4s; }
#index .row3 .r .btn:hover { right: 0; }
#index .row3 .r .imgs { /*width:9999px;
	height:100%;
	position:absolute;
	left:0;
	top:0;*/ }
#index .row3 .r .img { display: none; width: 800px; height: 100%; position: absolute; left: 0; top: 0; background-position: center; background-size: cover; }
#index .row4 { overflow: hidden; height: 480px; margin: 25px 0 0 0; }
#index .row4 .l { width: 60%; height: 100%; float: left; background-position: center; background-size: cover; }
#index .row4 .r { width: 38%; height: 100%; background: #2e2e2e; color: #fff; float: right; }
#index .row4 .t { font-size: 18px; line-height: 55px; height: 55px; border-top: 2px solid #999999; }
#index .row4 .r-box { margin: 55px 45px 0 45px; }
#index .row4 .cont { padding: 30px 0 0 0; font-size: 14px; line-height: 30px; }
#index .row4 .cont .p1 { font-size: 24px; margin: 0 0 20px 0; }
#index .row4 .more { width: 200px; height: 50px; line-height: 50px; margin: 50px 0 0 0; text-align: center; font-size: 16px; text-transform: uppercase; display: inline-block; border-radius: 25px; color: #fff; border: 2px solid #919191; transition: .3s; }
#index .row4 .more:hover { background: #fff; color: #919191; border-color: #fff; }
#index .row5 { overflow: hidden; margin: 25px 0 0 0; }
#index .row5 ul { width: 103%; }
#index .row5 li { width: 31%; float: left; overflow: hidden; background: #000; margin: 0 2% 0 0; position: relative; text-align: center; font-size: 24px; text-transform: uppercase; }
#index .row5 li a { color: #fff; }
#index .row5 li img { width: 100%; display: block; transition: .7s; }
#index .row5 .title { width: 100%; position: absolute; left: 0; top: 0; }
#index .row5 .p1 { font-size: 18px; padding: 30px 0 5px 0; }
#index .row5 .hide { display: none; }
#index .row5 .last a { color: #666666; }
#index .row5 a:hover img { transform: scale(1.1); -webkit-transform: scale(1.1); }


@media screen and (max-width:1600px) {
    #index { width: auto; margin: 80px 20px; }
}

@media screen and (max-width:1200px) {
    .index-banner .text { left: 80px; }
    .index-banner .loading { left: 80px; }
    .flex-pause, .flex-play { left: 96px; }
    .index-banner .text .p1 span { width: 120px; height: 34px; line-height: 34px; font-size: 24px; }
    .index-banner .text .p2 { font-size: 50px; padding: 10px 0 20px 0; }
    .index-banner .text .p3 { font-size: 20px; }
    .index-banner .text .p4 { padding: 5px 0 40px 0; }
    #index .row4 { height: auto; }
    #index .row4 .l { width: 100%; height: 360px; }
    #index .row4 .r { width: 100%; margin: 25px 0 0 0; padding: 0 0 40px 0; height: auto; float: left; }
}

@media screen and (max-width:1024px) {
    #index { margin: 20px 20px 10px 20px; }
    #index .news { width: 100%; }
    #index .news { height: 360px; }
    #index .news .btns { display: none; }
    #index .video { width: 100%; margin: 20px 0 0 0; float: left; }
    #index .row3 .l .top { display: none; }
    #index .row3 .l .m { display: none; }
    #index .row3 .r .m { display: none; }
    #index .row3 .r { width: 100%; }
    #index .row3 .r .top .cur, #index .row3 .r .top li:hover { background: url(../images/index-r3-title-bg2.png) no-repeat center 54px; }
    #index .row3 .r .top .cur:after { display: none; }
    #index .row4 { display: none; }
    #index .row5 li { width: 48%; height: 120px; padding: 20px 0 0 0; margin-bottom: 2%; background: url(../images/repeat-bg.jpg) repeat; color: #fff; }
    #index .row5 .first, #index .row5 .last { background: url(../images/index-about-bg.jpg) repeat; }
    #index .row5 .p1 { font-size: 14px; }
    #index .row5 .last a { color: #fff; }
    #index .row5 li img { display: none; }
    #index .row5 .hide { display: block; }
    #index .row5 .title { position: static; }
    .banners, .banners .bannerbox li, .bannerbox { height: auto !important; }
    .banners .bannerbox li { overflow: hidden; }
    .banners .bannerbox li .bimg { width: 100% !important; position: static !important; height: auto !important; }
    .index-banner .text { width: 100%; position: relative; left: 0; padding: 0 5%; box-sizing: border-box; top: 0; }
    .index-banner .text p { display: none; }
    .index-banner .text .p2 { display: block; opacity: 1; top: 0; padding: 20px 0 14px; text-align: center; font-size: 32px; }
    .banners .bannerbox li.imgIn .bimg { transform: matrix(1, 0, 0, 1, 0, 0); -webkit-transform: matrix(1, 0, 0, 1, 0, 0); }
    .index-banner .text .p5 { display: block; text-align: center; opacity: 1; top: 0; color: #d70c19; }
    .index-banner .text .p5 a { color: #d70c19; }
    .index-banner { padding-bottom: 35px; }
    .banner .flex-control-nav { bottom: 0; }
    .index-banner .loading { left: 5%; bottom: 20px; }
    .flex-pauseplay { position: absolute; left: 5%; width: 50px; bottom: 36px; }
    .flex-pause, .flex-play { bottom: 0; left: 18px; }
}

@media screen and (max-width:680px) {
    .index-banner .imgs .img { background-position: 30% center; }
    .index-banner .loading { left: 20px; }
    .index-banner .text .p2 { font-size: 26px; }
    .index-banner .text .p3 { font-size: 20px; }
    .index-banner .text .p4 { padding: 5px 0 40px 0; }
    #index { margin: 0; }
    #index .news { height: auto; }
    #index .news dl { margin: 30px 20px 30px 20px; }
    #index .news dt { margin: 0; }
    #index .news dt .more { display: none; }
    #index .news dd { height: auto; }
    #index .news ul { width: 100%; position: static; }
    #index .news li { display: none; font-size: 14px; }
    #index .news li:first-of-type { display: block; }
    #index .news .img { width: 100%; margin: 0 0 10px 0; }
    #index .news .text { width: 100%; height: auto; margin: 0; }
    #index .news .cont { display: none; }
    #index .news .title { padding: 10px 0 0 0; line-height: 24px; }
    #index .video { margin: 0; height: 180px; }
    #index .row2 { margin: 0; padding: 40px 0 30px 0; }
    #index .row2 .text { display: none; }
    #index .row2 img { width: 200px; }
    #index .row2 .more { width: 160px; height: 40px; line-height: 40px; margin: 40px 0 0 0; }
    #index .row3 { margin: 0; position: relative; }
    #index .row3:after { content: ''; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #c2111d; position: absolute; left: 50%; top: 0; margin: 0 0 0 -10px; }
    #index .row5 { margin: 6px 6px 0 6px; }
    .flex-pauseplay { left: 19px; }
    .banners .flex-control-nav { bottom: 10px; }
}


@media screen and (max-width:500px) {
    #index .row3 .r .top { height: auto; padding: 40px 0 50px 0; }
    #index .row3 .r .top ul { margin: 0 10%; height: auto; overflow: hidden; }
    #index .row3 .r .top li { width: 50%; height: 120px; padding: 0; background-position: center 24px!important; background-size: auto 70% !important; }
    #index .row3 .r .top li a { background-size: auto 60% !important; }
    #index-loading, .flex-pauseplay { display: none; }
}