/*
 * Swiper 2.7.6
 * Mobile touch slider and framework with hardware accelerated transitions
 *
 * http://www.idangero.us/sliders/swiper/
 *
 * Copyright 2010-2015, Vladimir Kharlampidi
 * The iDangero.us
 * http://www.idangero.us/
 *
 * Licensed under GPL & MIT
 *
 * Released on: February 11, 2015
*/
/* ===============================================================
Basic Swiper Styles 
================================================================*/
.swiper-container {
	margin:0 auto;
	position:relative;
	overflow:hidden;
	direction:ltr;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-ms-backface-visibility:hidden;
	-o-backface-visibility:hidden;
	backface-visibility:hidden;
	/* Fix of Webkit flickering */
	z-index:1;
}
.swiper-wrapper {
	position:relative;
	width:100%;
	-webkit-transition-property:-webkit-transform, left, top;
	-webkit-transition-duration:0s;
	-webkit-transform:translate3d(0px,0,0);
	-webkit-transition-timing-function:ease;
	
	-moz-transition-property:-moz-transform, left, top;
	-moz-transition-duration:0s;
	-moz-transform:translate3d(0px,0,0);
	-moz-transition-timing-function:ease;
	
	-o-transition-property:-o-transform, left, top;
	-o-transition-duration:0s;
	-o-transform:translate3d(0px,0,0);
	-o-transition-timing-function:ease;
	-o-transform:translate(0px,0px);
	
	-ms-transition-property:-ms-transform, left, top;
	-ms-transition-duration:0s;
	-ms-transform:translate3d(0px,0,0);
	-ms-transition-timing-function:ease;
	
	transition-property:transform, left, top;
	transition-duration:0s;
	transform:translate3d(0px,0,0);
	transition-timing-function:ease;

	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}
.swiper-free-mode > .swiper-wrapper {
	-webkit-transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-ms-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	margin: 0 auto;
}
.swiper-slide {
	float: left;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
	-ms-touch-action: pan-y;
}
.swiper-wp8-vertical {
	-ms-touch-action: pan-x;
}

/* ===============================================================
Your custom styles, here you need to specify container's and slide's
sizes, pagination, etc.
================================================================*/
.swiper-container {
	/* Specify Swiper's Size: */

	/*width:200px;
	height: 100px;*/
}
.swiper-slide {
	/* Specify Slides's Size: */
	
	/*width: 100%;
	height: 100%;*/
}
.swiper-slide-active {
	/* Specific active slide styling: */
	
}
.swiper-slide-visible {
	/* Specific visible slide styling: */	

}
/* ===============================================================
Pagination Styles
================================================================*/
.swiper-pagination-switch {
	/* Stylize pagination button: */	

}
.swiper-active-switch {
	/* Specific active button style: */	
	
}
.swiper-visible-switch {
	/* Specific visible button style: */	
	
}


.xs-banner {
	position: relative;
	background: #160052;
	height: 640px;
    min-width: 1200px;
}

/*轮播*/
.xs-banner-slider {
    height: 100%;
    overflow: hidden;
    position: relative;
}
.xs-banner-slider .item {
    position: absolute;
    height: 100%;
    width: 100%;
    left: -9999px;
}
.xs-banner-slider .item.show {
    left: 0;
}
.xs-banner-slider .item-banner-bg {
    position: absolute;
    width: 100%;
    height: 100%;
}
.xs-banner-slider .item-banner-bg .item-bg-img {
    position: absolute;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center 0;
    min-width: 1200px;
}
.xs-banner-slider .item-banner-content {
    height: 100%;
    position: relative;
    width: 1200px;
    margin: 0 auto;
    *zoom: 1;
}
.xs-banner-slider .item-banner-content .figure {
    position: absolute;
    top: 180px;
    left: 60px;
    width: 740px;
    height: 240px;
    word-break: break-word;
}
.xs-banner-slider .item-banner-content .figure .figure-tit {
    white-space: nowrap;
    margin-bottom: 10px;
    text-shadow: 0 2px 8px rgba(0,0,0,.7);
    font-size: 42px;
    color: #fff;
    font-weight: normal;
}
.xs-banner-slider .item-banner-content .figure .figure-con .figure-con-row {
    text-shadow: 0 2px 8px rgba(0,0,0,.7);
    line-height: 24px;
    font-size: 16px;
    color: #fff;
}
.xs-banner-slider .item-banner-content .figure .btn {
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    position: absolute;
    bottom: 70px;
    padding: 6px 30px;
    background: none;
    color: #fff;
    border: 1px solid #ccc;
}
.xs-banner-slider .item-banner-content .figure .btn:hover {
    background-color: #fff;
    color: #242424;
}
.xs-banner-slider .item-banner-content .figure.right-image {
    -webkit-animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -moz-animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -o-animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    animation: re-banner-slide-20 .8s cubic-bezier(.4,0,.2,1) 0s 1
}
.xs-banner-slider .item-banner-bg .right-image:nth-of-type(1) {
    -webkit-animation: re-banner-slide-80 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -moz-animation: re-banner-slide-80 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -o-animation: re-banner-slide-80 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    animation: re-banner-slide-80 .8s cubic-bezier(.4,0,.2,1) 0s 1
}

.xs-banner-slider .item-banner-bg .right-image:nth-of-type(2) {
    -webkit-animation: re-banner-slide-40 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -moz-animation: re-banner-slide-40 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    -o-animation: re-banner-slide-40 .8s cubic-bezier(.4,0,.2,1) 0s 1;
    animation: re-banner-slide-40 .8s cubic-bezier(.4,0,.2,1) 0s 1
}
@-webkit-keyframes re-banner-slide-20{
    from{
        opacity:0;
        -webkit-transform:translate3d(0,20px,0)
    }
    to{
        opacity:1
    }
}
@-moz-keyframes re-banner-slide-20{
    from{
        opacity:0;
        -webkit-transform:translate3d(0,20px,0);
        -moz-transform:translate3d(0,20px,0);
        transform:translate3d(0,20px,0)
    }
    to{
        opacity:1
    }
}
@-o-keyframes re-banner-slide-20{
    from{
        opacity:0;
        -webkit-transform:translate3d(0,20px,0);
        transform:translate3d(0,20px,0)
    }
    to{
        opacity:1
    }
}
@keyframes re-banner-slide-20{
    from{
        opacity:0;
        -webkit-transform:translate3d(0,20px,0);
        -moz-transform:translate3d(0,20px,0);
        transform:translate3d(0,20px,0)
    }
    to{
        opacity:1
    }
}
@-webkit-keyframes re-banner-slide-40 {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0,40px,0)
    }

    to {
        opacity: 1
    }
}

@-moz-keyframes re-banner-slide-40 {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0,40px,0);
        -moz-transform: translate3d(0,40px,0);
        transform: translate3d(0,40px,0)
    }

    to {
        opacity: 1
    }
}

@-o-keyframes re-banner-slide-40 {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0,40px,0);
        transform: translate3d(0,40px,0)
    }

    to {
        opacity: 1
    }
}

@keyframes re-banner-slide-40 {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0,40px,0);
        -moz-transform: translate3d(0,40px,0);
        transform: translate3d(0,40px,0)
    }

    to {
        opacity: 1
    }
}
@-webkit-keyframes re-banner-slide-80 {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0,80px,0)
    }

    to {
        opacity: 1
    }
}

@-moz-keyframes re-banner-slide-80 {
    from {
        opacity: 0;
        -moz-transform: translateY(80px);
        transform: translateY(80px)
    }

    to {
        opacity: 1
    }
}

@-o-keyframes re-banner-slide-80 {
    from {
        opacity: 0;
        -o-transform: translateY(80px);
        transform: translateY(80px)
    }

    to {
        opacity: 1
    }
}

@keyframes re-banner-slide-80 {
    from {
        opacity: 0;
        -webkit-transform: translateY(80px);
        -moz-transform: translateY(80px);
        -o-transform: translateY(80px);
        transform: translateY(80px)
    }

    to {
        opacity: 1
    }
}



/*方案*/
.index-jjfaw{ height: 420px;background:#373d41; width:100%;}
.index-jjfa {
    height: 420px;
    width: 1200px;
    min-width: 1200px;
    background:#373d41;
    overflow: hidden;
    position: relative;
	margin:37px auto 0;
}
.index-jjfa-wrapper {
    max-width: 1200px;
    min-width: 1200px;
    margin: 0 auto;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.index-jjfa-wrapper .swiper-wrapper {
    height: 100%;
}
.index-jjfa-wrapper .item {
    float: left;
    width: 20%;
    height: 100%;
    color: #fff;
    position: relative;
    text-align: center;
    background-position: center 0;
    background-size: 100% 100%;
}
.index-jjfa-wrapper .item .item-bg {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #161a1d;
    opacity: .6;
    filter: alpha(opacity=60);
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(60));
    transition: all .4s cubic-bezier(.4,0,.2,1);
}
.index-jjfa-wrapper .item .item-cont {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    transition: all .4s cubic-bezier(.4,0,.2,1);
}
.index-jjfa-wrapper .item .item-cont .img {
    margin-top: 123px;
    margin-bottom: 15px;
    transition: all .4s cubic-bezier(.4,0,.2,1);
}
.index-jjfa-wrapper .item .item-cont .img-line {
    display: block;
    width: 20px;
    height: 2px;
    background: #fff;
    margin:0 auto; 
    transition: all .4s cubic-bezier(.4,0,.2,1);
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(100));
}
.index-jjfa-wrapper .item .item-cont .title {
    font-size: 20px;
    margin-top: 40px;
    transition: all .4s cubic-bezier(.4,0,.2,1);
}
.index-jjfa-wrapper .item .item-cont .item-bot {
    margin-top: 30px;
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(0));
    transition: all .4s cubic-bezier(.4,0,.2,1);
}
.index-jjfa-wrapper .item .item-cont .title-msg {
    font-size: 14px;
    line-height: 29px;
    padding: 0 24px;
}
.index-jjfa-wrapper .item .item-cont .go-detail {
    margin-top: 45px;
    font-size: 14px;
    width: 120px;
    height: 38px;
    line-height: 36px;
    background:transparent;
    border: 1px solid #fff;
    color: #fff;
    transition: all .4s cubic-bezier(.4,0,.2,1);
}
.index-jjfa-wrapper .item .item-cont .go-detail:hover {
    background:#fff;
    color: #5481fe;
}

/*滑过效果*/
.index-jjfa-wrapper .item:hover .item-bg {
    background: #5481fe;
    opacity: .9;
    filter: alpha(opacity=90);
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(90));
}
.index-jjfa-wrapper .item:hover .img-line {
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(0));
}
.index-jjfa-wrapper .item:hover .img {
    margin-top: 62px;
    margin-bottom: 0;
}
.index-jjfa-wrapper .item:hover .title  {
    margin-top: 26px;
}
.index-jjfa-wrapper .item:hover .item-bot {
    margin-top: 17px;
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(100));
}
.index-jjfa-wrapper .item:hover .go-detail {
    margin-top: 33px;
}

/*点击*/
.jjfa-swiper-prev, .jjfa-swiper-next {
    display: none;
    width: 50px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    background: rgba(22,26,29,.3) url(../images/l.png) no-repeat center;
}
.jjfa-swiper-next {
    left: auto;
    right: 0;
    background: rgba(22,26,29,.3) url(../images/r.png) no-repeat center;
}