/* index banner start */
.stage { width: 100%; }
.stage .banner { width: 100%; background: #151415; position: relative; border-bottom: 45px solid #191919; }
.stage .banner .wrap { height: 573px; background: url('../images/banner_bg.jpg') no-repeat; }
.stage .banner .wrap .swiper-slide { position: absolute; opacity: 0; box-sizing: border-box;cursor: pointer; }
.stage .banner .wrap .content { width: 40%; position: absolute; left: 5%; top: 50%; transform: translateY(-50%); }
.stage .banner .wrap .content > div > div { width: 100%; color: #fff; }
.stage .banner .wrap .content .title { height: 86px; line-height: 86px; font-weight: bold; font-size: 82px; }
.stage .banner .wrap .content .ico { height: 86px; line-height: 0; font-size: 82px; text-indent: 5px; }
.stage .banner .wrap .content .depict { height: 56px; line-height: 56px; font-size: 34px; }
.stage .banner .wrap .content .info { height: 56px; line-height: 26px; font-size: 12px; color: #969396; }
.stage .banner .wrap .content .btn_view { margin-top: 20px;width: 177px;height: 40px;line-height: 40px;text-align: center;font-size: 11px;color: #fff;background-color: #c2257e; }
.stage .banner .wrap .content .btn_view::before { content: '';display: inline-block;position: absolute;top: -2px;left: -2px;bottom: -2px;right: -2px;border: 1px solid #c2257e;animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite; }
.stage .banner .wrap .photo { width: 56%; height: 100%; position: absolute; right: 0; }
.stage .banner .wrap .photo .shim { width: 630px; height: 420px; position: absolute; top: 80px; margin-left: 30px; background: #c21e7e; }
.stage .banner .wrap .photo .ico { height: 40%; position: absolute; bottom: 30px; right: 0; }
.stage .banner .wrap .photo .img { width: 630px; height: 420px; position: absolute; top: 50px; left: 0; }

.swiper-pagination { width: 100%; height: 30px; bottom: -6px; z-index: 19; }
.swiper-pagination span { position: relative; width: 18px; height: 18px; margin: 0 3px; border-radius: 50%; display: inline-block; transition: all .3s linear; }
.swiper-pagination span::after { position: absolute; left: 50%; top: 50%; margin-left: -1px; margin-top: -1px; display: block; content: ' '; width: 2px; height: 2px; border-radius: 50%; background: #626262; }
.swiper-pagination span.active { background: #626262; }
.swiper-pagination span.active::after { background: #000; }
.btn-next,.btn-prev { position: absolute;top: 50%;transform: translateY(-50%);cursor: pointer; }
.btn-next i,.btn-prev i { font-size: 50px;color: #696869; }
.btn-next i:hover,.btn-prev i:hover { animation: swiperBtnAni .3s ease-out forwards; }
@keyframes swiperBtnAni {
    from { font-size: 50px;color: #696869; }
    to { font-size: 60px;color: #c21e7e; }
}

.btn-next { right: 15px; }
.btn-prev { left: 15px; }

/* index banner end */
/* media start */
.stage .media { width: 100%; background: #141414; border-bottom: 45px solid #191919; }
.stage .media .wrap { height: 578px; }
.stage .media .wrap img { width: 100%; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }

/* media end */

/* gallery start */
.stage .gallery { background: #191919; overflow: hidden; padding-right: 5px; padding-left: 5px; margin-right: auto; margin-left: auto;border-bottom: 45px solid #191919; }
.stage .gallery .grow { margin-right: -15px; margin-left: -15px; }
.stage .gallery .gitem { position: relative; overflow: hidden; float: left; margin: 0 0 10px; margin-right: 5px; margin-left: 5px; background-size: cover; background-repeat: no-repeat; cursor: pointer;padding-bottom: 12%; }
/* .stage .gallery .gitem:hover { animation: fadeIn .2s linear forwards; } */
.stage .gallery .gitem .hover-border { position: absolute;top: 0;bottom: 0;left: 0;right: 0; }
@keyframes fadeIn {
    from{opacity:1}
    to { opacity: .8; }
}
.stage .gallery .x50 { width: calc(50% - 10px); }
.stage .gallery .x25 { width: calc(25% - 10px); }
.stage .gallery .gimg1 { background-image: url('../images/home/slide1.jpg'); }
.stage .gallery .gimg2 { background-image: url('../images/home/slide2.jpg'); }
.stage .gallery .gimg3 { background-image: url('../images/home/slide3.jpg'); }
.stage .gallery .gimg4 { background-image: url('../images/home/slide4.jpg'); }
.stage .gallery .gimg5 { background-image: url('../images/home/slide5.jpg'); }
.stage .gallery .gimg6 { background-image: url('../images/home/slide6.jpg'); }
/*.stage .gallery img { width: 98%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); transition: all .5s linear; }*/

/* gallery end*/

/* Logo list start */
.stage .logolist { background: #161616; }
.stage .logolist .wrap { }
.stage .logolist .wrap .title { width: 308px; margin: 100px 0 90px 50%; transform: translateX(-50%); }
.stage .logolist .wrap .logos { width: 100%; margin-bottom: 85px; }
/* Logo list end */





/* iPad 适配 */
@media only screen and (max-width:1200px ) {

    /* banner start */
    .stage .banner .wrap { width: 740px; height: 305px; background-size: cover; }
    .stage .banner .wrap .content .title { height: 56px; line-height: 56px; font-weight: bold; font-size: 52px; }
    .stage .banner .wrap .content .ico { height: 56px; line-height: 0; font-size: 52px; text-indent: 5px; }
    .stage .banner .wrap .content .depict { height: 36px; line-height: 36px; font-size: 26px; }
    .stage .banner .wrap .content .info { height: 36px; line-height: 26px; font-size: 10px; color: #969396; }
    .stage .banner .wrap .content .btn_view { margin-top: 15px;width: 126px;height: 35px;line-height: 35px; }
    .stage .banner .wrap .photo { width: 55%; right: 0; }
    .stage .banner .wrap .photo .img { width: 365px; height: auto; right: 30px; top: 25px; left: initial; }
    .stage .banner .wrap .photo .shim { width: 365px; height: 240px; top: 55px; right: 0; }
    .stage .banner .wrap .photo .ico { bottom: 30px; margin-left: 350px; }
    /* banner end */

    /* media start */
    .stage .media .wrap { width: 640px; height: 360px; }
    /* media end */

    /* gallery start */
    /* .stage .gallery .gitem { height: 160px; } */
    /* gallery end */

    /* Logo list start */
    .stage .logolist { background: #191919; }
    .stage .logolist .wrap { width: 640px; }
    .stage .logolist .wrap .title { width: 180px; margin: 60px 0 50px 50%; transform: translateX(-50%); }
    .stage .logolist .wrap .logos { width: 100%; margin-bottom: 85px; }
    /* Logo list end */
}

@media screen and (max-width:760px) {
    .stage .banner .wrap { width: 660px; }
    .stage .banner .wrap { width: 640px; }
    .stage .banner .wrap .photo { right: 0; }
    .stage .banner .wrap .content { left: 0; }
    .stage .banner .wrap .content .title { height: 46px; line-height: 46px; font-weight: bold; font-size: 42px; }
    .stage .banner .wrap .content .depict { height: 30px; line-height: 30px; font-size: 20px; }
}


/* Mobile 适配 */
@media screen and (max-width:720px) {
    /* banner start */
    .stage .banner { margin-top: 40px; border-bottom: 15px solid #191919; }
    .stage .banner .wrap { width: 100%; height: 230px; background: url('../images/banner_bg_mb.jpg') no-repeat; background-size: 100%; }
    .stage .banner .wrap .content { width: 40%; position: absolute; left: 5%; top: 50%; transform: translateY(-56%); z-index: 2; }
    .stage .banner .wrap .content .title { height: 30px; line-height: 30px; font-size: 24px; }
    .stage .banner .wrap .content .ico { height: 30px; line-height: 0; font-size: 30px; text-indent: 5px; }
    .stage .banner .wrap .content .depict { height: 26px; line-height: 26px; font-size: 12px; font-weight: bold; }
    .stage .banner .wrap .content .info { height: auto; line-height: 16px; font-size: 12px; margin-top: 5px; color: rgba(255,255,255,.85); }
    .stage .banner .wrap .content .btn_view { margin-top: 20px; }
    .stage .banner .wrap .content .btn_view img { height: 24px; width: auto !important; }

    .stage .banner .wrap .photo .shim { width: calc(100% - 20px); height: 135px; position: absolute; top: 48px; margin-left: 20px; background: #c21e7e; }
    .stage .banner .wrap .photo .ico { width: 40%; height: auto; position: absolute; bottom: 42px; right: -26px; }
    .stage .banner .wrap .photo .img { width: 100%; height: auto; position: absolute; top: 30px; left: 0; }

    .btn-next,.btn-prev { display: none; }
    /* banner end */

    /* media start */
    .stage .media { border-bottom: 15px solid #191919; }
    .stage .media .wrap { width: 100%; height: 180px; }
    /* media end */

    /* gallery start */
    .stage .gallery .grow { width: 100%; overflow: hidden; position: relative; left: 50%; transform: translateX(-50%); margin: 0 auto; }
    .stage .gallery .gitem { width: 100%;  margin: 0 0 10px;padding-bottom: 55%; }
    /* .stage .gallery .gimg6 { height: 188px; } */
    /* gallery end */

    /* Logo list start */
    .stage .logolist { }
    .stage .logolist .wrap { width: 100%; }
    .stage .logolist .wrap .title { display: block;width: 154px; margin: 45px auto;transform: translateX(0); }
    .stage .logolist .wrap .title img { width: 100%; }
    .stage .logolist .wrap .logos { width: 100%; margin-bottom: 40px; }
    /* Logo list end */
}