/* 测试是否一致 */
/* body{opacity: 0.8;}::-webkit-scrollbar{width: 0;}html{background: top left no-repeat url(../pic/0-0.jpg) !important;} */

.home_swiper{height:  ; position: relative;z-index: 1;}
.home_swiper .home_swiper_box{position: relative;transition: all ease-in-out .7s;-ms-transition: all ease-in-out .7s;-moz-transition: all ease-in-out .7s;-webkit-transition: all ease-in-out .7s;-o-transition: all ease-in-out .7s;}
.home_swiper.not_first_screen .home_swiper_box{transform: translateY(- );}
/* .home_swiper > .swiper-wrapper{transition: transform 0.7s cubic-bezier(0.5,0,0.2,1) 0s;} */
.wrapbanner,.home_slide{height:  ;overflow: hidden;box-sizing: border-box;position: relative;}
.home_slide{padding-top: 0px;background: #fff;overflow: auto;}
.content{box-sizing: border-box;background: #fff;overflow-x: hidden;}
@media screen and (max-width: 996px){
	.home_swiper.not_first_screen .home_swiper_box{transform: translateY(0);}
	.home_swiper,.home_swiper > .swiper-wrapper,.wrapbanner, .home_slide{height: auto;display: block;}
	.home_slide{padding-top: 0;}
}

.wrapbanner{overflow: hidden;}
.banner a{display:block;position:relative;} 
.banner a::after{content: '';display: block;width: 100%;height: 20%;position: absolute;bottom: 0;left: 0;background-image: -moz-linear-gradient( 90deg, rgba(0,0,0,0.702) 0%, rgba(0,0,0,0) 100%);background-image: -webkit-linear-gradient( 90deg, rgba(0,0,0,0.702) 0%, rgba(0,0,0,0) 100%);background-image: -ms-linear-gradient( 90deg, rgba(0,0,0,0.702) 0%, rgba(0,0,0,0) 100%);opacity: 0.702; }


 

  
.banner .gp-img img{animation:scaleBig 10s linear 0s 1 both;transform-style:preserve-3d}
@-webkit-keyframes scaleBig{
	0%{transform:scale(1)}
	100%{transform:scale(1.1)}
}
@keyframes scaleBig{
	0%{transform:scale(1)}
	100%{transform:scale(1.1)}
}
/* .swiper-slide-active  */

.banner .title{color:#fff;white-space:nowrap;overflow: hidden;text-overflow: ellipsis;line-height:1.2em;bottom: 3rem;z-index: 2;transition: all ease-in-out .3s;-ms-transition: all ease-in-out .3s;-moz-transition: all ease-in-out .3s;-webkit-transition: all ease-in-out .3s;-o-transition: all ease-in-out .3s;font-weight: bold;position: absolute;left: 50%;transform: translateX(-50%);box-sizing: border-box;padding-right: 10rem;} 
.banner .gp-img{display:block;overflow:hidden;position:relative;background-size: cover !important;padding-bottom: 42.70%;height: 0;}
.banner .gp-img video,.banner .gp-img img{width:100%;height: 100%;position: absolute;left: 0;top: 0;}
.banner .gp-img img{min-width: 100%;object-fit: cover;}
.banner .gp-img video{width:100%;height: auto;position: absolute;left: 0;top: 50%;transform: translateY(-50%);}
/* .banner .swiper-slide-active .gp-img{animation:scaleBig 7s linear 0s 1 both;transform-style:preserve-3d} */
@-webkit-keyframes scaleBig{
	0%{transform:scale(1)}
	100%{transform:scale(1.1)}
}
@keyframes scaleBig{
	0%{transform:scale(1)}
	100%{transform:scale(1.1)}
}
 

.wrapbanner .wrap_swiper_pagination{position: absolute;right: 16rem; bottom: 4rem;text-align: right;z-index: 2;}
.wrapbanner .more{display: inline-block;color: #fff;position: relative;line-height: 4rem;height: 4rem;font-size: 1.6rem;z-index: 2;vertical-align: middle;padding: 0 0 0 2.8rem;margin: 0 0 0 2rem;}
.wrapbanner .more::before{content: '';display: block;width: .1rem;height: 1.8rem;position: absolute;left: 0;top: 50%;transform: translateY(-50%);background: #fff;}
.wrapbanner a.more::after{display: none;}
.wrapbanner .swiper-pagination{left: 0;width: auto;bottom: 0;position: relative;display: inline-block;vertical-align: middle;}
.wrapbanner .swiper-pagination .swiper-pagination-bullet{width: 3rem;height: 2px;background: rgba(255,255,255,.5);opacity: 1;border-radius: 0;margin: 0 1rem;border: none;box-sizing: border-box;line-height: 2px;text-align: center;color: #fff; }
.wrapbanner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background: #fff; }

@media screen and (max-width: 996px){
	/* .banner a{padding-top: 0;} */
	/* .banner .gp-img{padding-bottom: 44.27%;height: 0;} */
	.banner .swiper-slide-active .title{bottom: 20px;width: calc(100% - 40px) !important;
        position: absolute;
        left: auto;
        transform: none;
        box-sizing: border-box;
        padding-right: 0rem;
    }
	.wrapbanner{padding: 0;}
	.wrapbanner .arrow{display: none;}
	.wrapbanner .swiper_menu{background: transparent;width: auto;height: auto;padding: 10px 0 0;}
	/* .wrapbanner .swiper-pagination .swiper-pagination-bullet{width: 10px;height: 10px;margin: 0 5px;font-size: 0;} */
    .wrapbanner .swiper-pagination{height: 12px;}
    .wrapbanner .wrap_swiper_pagination{bottom: 1rem;right: 50%;transform: translateX(50%);}
    .wrapbanner .more{} 
}
@media screen and (max-width:767px){
	.banner{position: relative;}
	.banner .title{display: none;}

}


.index_title{display: flex;align-items: center;justify-content: space-between;border-bottom: 1px solid rgba(0,0,0,0.08);box-sizing: border-box;padding-bottom: 18px;}
.index_title .channel_title{color: #0e3265;font-weight: bold;}
.index_title .channel_link{color: #0e3265;width: 12.9rem;height: 4.4rem;text-align: center;line-height: 4.4rem;border-radius: 2.2rem;background: #fff;position: relative;transition: all 0.2s ease-in-out;} 
.index_title .channel_link:hover{letter-spacing: 1px;box-shadow: 0px 15px 30px -15px rgba(75,114,171, 0.5)}

 


.wrap_mode01{background: url(../images2024/mode1_bg.png) no-repeat;background-size: cover; ;box-sizing: border-box;padding: 5rem 0 7rem;}
.mode01{display: flex;}
.mode01 .lf{width: 71.42%;margin-right: 6rem; } 
.mode01 .rt{flex: 1;overflow: hidden;display: flex;flex-direction: column;}
.mode01 .rt .index_01b {flex: 1;overflow: hidden;margin-top: calc(3rem - 4px);}
.mode01 .rt .index_01b  ul{height: 100%;;display: flex;flex-wrap: wrap;margin: 0 -2px;}
.mode01 .rt .index_01b  ul li{width: 50%;margin-top: 4px;height: 33.3%; }
.mode01 .rt .index_01b  ul li a{display: block;margin: 0 2px;height: 100%;box-sizing: border-box;padding: 2rem 0 0 3rem ;}
.mode01 .rt .index_01b  ul li a .title{color: #fff;font-weight: bold;text-transform: uppercase;line-height: 1.333;position: relative;}
.mode01 .rt .index_01b  ul li a .title span{position: relative;}
.mode01 .rt .index_01b  ul li a .title::before{content: "";display: block;width: calc(100% - 0.5em);height: 10px;background: rgba(0,0,0,0.102);position: absolute;right: 0;bottom: 0;}
.mode01 .rt .index_01b  ul li a .item{margin: 15px 0 16px;max-height: 5.5rem;line-height: 5.5rem;}
.mode01 .rt .index_01b  ul li a .item img{max-height: 100%;display: inline-block;vertical-align: middle;max-width: 95%;}
.mode01 .rt .index_01b  ul li a:hover .item img{animation: icon-bounce 0.5s alternate;}

.mode01 .rt .index_01b  ul li:nth-child(1) a{background: url(../images2024/bg2.png) no-repeat right bottom #7ea7e0;}
.mode01 .rt .index_01b  ul li:nth-child(2) a{background: url(../images2024/bg3.png) no-repeat left bottom #b190e0;}
.mode01 .rt .index_01b  ul li:nth-child(3) a{background: url(../images2024/bg4.png) no-repeat right top #7fcdd4;}
.mode01 .rt .index_01b  ul li:nth-child(4) a{background: url(../images2024/bg5.png) no-repeat left top #e0c1ab;}
.mode01 .rt .index_01b  ul li:nth-child(5) a{background: url(../images2024/bg6.png) no-repeat right bottom #9fd48e;}
.mode01 .rt .index_01b  ul li:nth-child(6) a{background: url(../images2024/bg7.png) no-repeat left bottom #7ea7e0;} 

.tab1{position: relative;}
.tabMenu1{border-bottom: 1px solid rgba(0,0,0,0.08);box-sizing: border-box;padding-bottom: 1.6rem; }
.tabMenu1 li{display: inline-block;vertical-align: baseline;margin-left: 3rem;}
.tabMenu1 li:first-child{ margin-left: 0rem;}
.tabMenu1 li a{display: block; transition: background 0.4s,color 0.4s ease-in-out;color: #444;line-height: 4.4rem;}
.tabMenu1 li.on a{ color: #0e3265;font-weight: bold; }
.tab1 .tabMore1{position: absolute;right: 0; top: 0px;}
.tab1 .tabMore1 a{display: none;color: #0e3265;width: 12.9rem;height: 4.4rem;text-align: center;line-height: 4.4rem;border-radius: 2.2rem;background: #fff;transition: all 0.2s ease-in-out;} 
.tab1 .tabMore1 a:hover{letter-spacing: 1px;box-shadow: 0px 15px 30px -15px rgba(75,114,171, 0.5)}
.tab1 .tabList{margin-top: -1rem;}
.tabListBox{display: none;} 
.BTG-list1{ margin: 0 -2rem;}
.BTG-list1 li{margin-top: 4rem;} 
.BTG-list1 li a{display: block;margin:0 2rem;}
.BTG-list1 li a .gp-img{position: relative;padding-bottom: 56.20%;}
.BTG-list1 li a .gp-img::before{content: "";display: block;width: 100%;height: 100%;background-image: -moz-linear-gradient( 90deg, rgba(0,0,0,0.702) 0%, rgba(0,0,0,0) 100%);background-image: -webkit-linear-gradient( 90deg, rgba(0,0,0,0.702) 0%, rgba(0,0,0,0) 100%);background-image: -ms-linear-gradient( 90deg, rgba(0,0,0,0.702) 0%, rgba(0,0,0,0) 100%);opacity: 0.702;;position: absolute;left: 0;bottom: 0;} 
.BTG-list1 li a .gp-img .date{position: absolute;left: 0;bottom: 0.4rem;width: 100%;color: #fff;text-align: center;}
.BTG-list1 li a .info{box-sizing: border-box;padding: 16px 30px 12px;background: #fff;}
.BTG-list1 li a:hover .info{box-shadow: 0 0px 10px   rgba(0,0,0,0.1);}
.BTG-list1 li a .info .title{color: #444; line-height: 1.556;line-height:1.556;height:4.668em;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;display: -moz-box;display: -ms-flexbox;-webkit-line-clamp: 3;-webkit-box-orient: vertical;-moz-box-orient: vertical;}
.BTG-list1 li a:hover .info .title{color: #0e3265;}
 
 
 
.wrap_mode02{box-sizing: border-box;padding: 5rem 0 6rem;}
.tab2{}
.tab2 .tabList{margin-top: 3rem;}
.tab2 .tabList .tabListBox{}
.tab2 .tabList .tabListBox .con{display: flex;justify-content: space-between;}
.tab2 .tabList .tabListBox .lf{width: 53.14%;display: block;}
.tab2 .tabList .tabListBox .lf .gp-img{padding-bottom: 56.18%;}
.tab2 .tabList .tabListBox .lf .info{background: #fff;box-sizing: border-box;padding: 2rem 3rem 3rem;border: 1px solid rgba(0,0,0,0.1);border-top: none;}
.tab2 .tabList .tabListBox .lf:hover .info{box-shadow: 0 0px 10px   rgba(0,0,0,0.1);}
.tab2 .tabList .tabListBox .lf .info .title{color: #222;font-weight: bold;line-height: 1.2;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.tab2 .tabList .tabListBox .lf:hover .info .title{color: #0e3265;}
.tab2 .tabList .tabListBox .lf .info .summary{color: #999;line-height: 1.714; ;height:3.428em;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;display: -moz-box;display: -ms-flexbox;-webkit-line-clamp: 2;-webkit-box-orient: vertical;-moz-box-orient: vertical;margin-top: 2rem;}
.tab2 .tabList .tabListBox .lf .info .date{color: #999;margin-top: 3rem;position: relative;box-sizing: border-box;padding: 1rem 0 0;}
.tab2 .tabList .tabListBox .lf .info .date::before{content: "";display: block;width: 50%;height: 0;border-top: 1px solid rgba(0,0,0,0.1);position: absolute;left: 0;top: 0;}
.tab2 .tabList .tabListBox .lf .info .date span{color: #0e3265;display: inline-block;margin-right: 10px;}
.tab2 .tabList .tabListBox .rt{width: 43.28%;/* float: right; */text-align: right;margin-top: 2rem;}
.tab2 .tabList .tabListBox .rt ul{
    text-align: left;
}
.tab2 .tabList .tabListBox .rt ul li{margin-bottom: 10px;}
.tab2 .tabList .tabListBox .rt ul li a{box-sizing: border-box;padding: 2.2rem 2rem;display: flex;background-color: rgb(245, 245, 245);position: relative;}
.tab2 .tabList .tabListBox .rt ul li a::before{content: "";display: block;width: 0%;height: 100%;background: #0e3265;position: absolute;left: 0;top: 0;transition: all 0.3s ease-in-out;}
.tab2 .tabList .tabListBox .rt ul li a:hover::before{width: 100%;}
.tab2 .tabList .tabListBox .rt ul li a:hover{box-shadow: 0px 15px 30px 0px rgba(75,114,171, 0.3);position: relative;z-index: 1;}
.tab2 .tabList .tabListBox .rt ul li a .date{margin-right: 20px;box-sizing: border-box;padding-right: 20px;border-right: 1px solid rgb(0, 0, 0,0.102);text-align: right;position: relative;}
.tab2 .tabList .tabListBox .rt ul li a:hover .date{border-right: 1px solid rgb(255, 255, 255,0.102);}
.tab2 .tabList .tabListBox .rt ul li a .date .l{color: rgb(14, 50, 101); font-weight: bold;}
.tab2 .tabList .tabListBox .rt ul li a:hover .date .l{color: #fff; }
.tab2 .tabList .tabListBox .rt ul li a .date .s{color: #999; }
.tab2 .tabList .tabListBox .rt ul li a:hover .date .s{color: #fff;}
.tab2 .tabList .tabListBox .rt ul li a .title{flex: 1;overflow: hidden;color: rgb(34, 34, 34);line-height: 1.556;height:3.112em;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;display: -moz-box;display: -ms-flexbox;-webkit-line-clamp: 2;-webkit-box-orient: vertical;-moz-box-orient: vertical;position: relative;}
.tab2 .tabList .tabListBox .rt ul li a:hover .title{color: #fff;font-weight: bold;}
.tab2 .tabList .tabListBox .rt .channel_link{color: #fff;width: 12.9rem;height: 4.4rem;text-align: center;line-height: 4.4rem;border-radius: 2.2rem;background: #0e3265;display: inline-block;margin-top: 15px;transition: all 0.2s ease-out;}
.tab2 .tabList .tabListBox .rt .channel_link:hover{letter-spacing: 1px;box-shadow: 0px 15px 30px -15px rgba(75,114,171, 0.5)}

 
.wrap_mode03{background: url(../images2024/mode3_bg.png) no-repeat center;background-size: cover; ;box-sizing: border-box;padding: 11rem 0 7.5rem;margin-top: -10rem;}
.mode03{display: flex;justify-content: space-between;}
.mode03 >div{width: 47.14%;}
.mode03 .lf{}
.mode03 .rt{}
.index_03{}
 
.index_03 ul li{margin-bottom: 0px;border-bottom: 1px solid #ebebeb;}
.index_03 ul li a{box-sizing: border-box;padding: 2.3rem 0;display: flex; position: relative;transition: all 0.25s ease-in-out;} 
.index_03 ul li a .date{margin-right: 20px;box-sizing: border-box;padding-right: 20px;border-right: 1px solid rgb(0, 0, 0,0.102);text-align: right;position: relative;transition: all 0.2s ease-in-out;} 
.index_03 ul li a .date .l{color: rgb(14, 50, 101); font-weight: bold;} 
.index_03 ul li a .date .s{color: #999; } 
.index_03 ul li a .title{flex: 1;overflow: hidden;color: rgb(34, 34, 34);line-height: 1.556;height:3.112em;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;display: -moz-box;display: -ms-flexbox;-webkit-line-clamp: 2;-webkit-box-orient: vertical;-moz-box-orient: vertical;position: relative;transition: all 0.2s ease-in-out;}
.index_03 ul li a:hover{box-shadow: 0px 14px 35px 0px rgba(14,50,101, 0.2);background: #fff;padding: 2.3rem 1rem;}
.index_03 ul li a:hover .title{ color: #0e3265; }
/* .index_03 ul li a:hover .date{  transform: translateX(6px);} */
/* .index_03 ul li a:hover .more{  transform: translateX(-6px); } */
.index_03 ul li a .more{position: relative;transition: all 0.2s ease-in-out;margin-left: 10px;}
.index_03 ul li a .more span{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%)  rotate(180deg);} 
   
  
@media screen and (max-width:1640px){
	/* .wrap_mode03{margin-top: -1rem;} */
}
@media screen and (max-width:1460px){
	/* .wrap_mode03{margin-top: -2rem;}  */
}
@media screen and (max-width:1400px){
    /* .tab2 .tabList .tabListBox .lf .info .summary{font-size: 1.6rem;} */
    /* .BTG-list1 li a .gp-img .date，.tab2 .tabList .tabListBox .rt ul li a .date .s{font-size: 1.4rem;} */
}
@media screen and (max-width:1280px){
	/* .wrap_mode03{margin-top: -2.5rem;}  */
}
@media screen and (max-width:1100px){
	/* .wrap_mode03{margin-top: -3rem;}  */
}
@media screen and (max-width: 996px){ 
	.wrap_mode03{margin-top: -8rem;} 
    .tab1 .tabMore1 a,.index_title .channel_link,.tab2 .tabList .tabListBox .rt .channel_link{width: auto;height: auto;line-height: normal;box-sizing: border-box;padding: 6px 12px;}
    .mode01{flex-direction: column;}
    .mode01 .lf{width: 100%;margin-right: 0;}
    .mode01 .rt{width: 100%;margin-top: 30px;} 
    .mode01 .rt .index_01b ul li a { padding: 2rem 0 2rem 3rem;}
    .mode01 .rt .index_01b ul li a .item {margin: 10px 0;max-height: none;line-height: 5rem;}
    .mode01 .rt .index_01b ul li a .item img{max-height: 5rem;}
    .BTG-list1 li a .info {padding: 10px 20px;}

    /* .BTG-list1 li a .info .title{height: auto;} */
}
@media screen and (max-width:767px){ 
    .tabMenu1{overflow-x: auto;white-space: nowrap;padding-right: 90px;box-sizing: border-box;}
	.wrap_mode03{margin-top: 0rem;padding: 6rem 0;} 
    .tab2 .tabList .tabListBox .con{justify-content: flex-start;flex-direction: column;}
    .tab2 .tabList .tabListBox .lf{width: 100%;position: relative;}
    .tab2 .tabList .tabListBox .rt{width: 100%;float: none;margin-top: 30px;}
    .mode03{flex-direction: column;}
    .mode03 >div{width: 100%;}
    .mode03 .rt{margin-top: 30px;}

    .BTG-list1 li a .info .title { 
        height: 3.112em; 
        -webkit-line-clamp: 2; 
    }
    .tab2 .tabList .tabListBox .lf .info .summary{height: auto;}
}
@media screen and (max-width:479px){ 
    .BTG-list1 li a .info .title { 
        height: auto; 
        -webkit-line-clamp: 2; 
    }
}
 

@keyframes icon-bounce {

    0%,
    100% {
        -moz-transform: translate3d(0%, -0%, 0) rotate(0deg);
        -ms-transform: translate3d(0%, -0%, 0) rotate(0deg);
        -webkit-transform: translate3d(0%, -0%, 0) rotate(0deg);
        transform: translate3d(0%, -0%, 0) rotate(0deg)
    }

    25% {
        -moz-transform: translate3d(0%, -0%, 0) rotate(15deg);
        -ms-transform: translate3d(0%, -0%, 0) rotate(15deg);
        -webkit-transform: translate3d(0%, -0%, 0) rotate(15deg);
        transform: translate3d(0%, -0%, 0) rotate(15deg)
    }

    50% {
        -moz-transform: translate3d(0%, -0%, 0) rotate(-15deg);
        -ms-transform: translate3d(0%, -0%, 0) rotate(-15deg);
        -webkit-transform: translate3d(0%, -0%, 0) rotate(-15deg);
        transform: translate3d(0%, -0%, 0) rotate(-15deg)
    }

    75% {
        -moz-transform: translate3d(0%, -0%, 0) rotate(5deg);
        -ms-transform: translate3d(0%, -0%, 0) rotate(5deg);
        -webkit-transform: translate3d(0%, -0%, 0) rotate(5deg);
        transform: translate3d(0%, -0%, 0) rotate(5deg)
    }

    85% {
        -moz-transform: translate3d(0%, -0%, 0) rotate(-5deg);
        -ms-transform: translate3d(0%, -0%, 0) rotate(-5deg);
        -webkit-transform: translate3d(0%, -0%, 0) rotate(-5deg);
        transform: translate3d(0%, -0%, 0) rotate(-5deg)
    }
}

@-webkit-keyframes icon-bounce {

    0%,
    100% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        transform: translate3d(-50%, -80%, 0) rotate(0deg)
    }

    25% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        transform: translate3d(-50%, -80%, 0) rotate(15deg)
    }

    50% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        transform: translate3d(-50%, -80%, 0) rotate(-15deg)
    }

    75% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        transform: translate3d(-50%, -80%, 0) rotate(5deg)
    }

    85% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        transform: translate3d(-50%, -80%, 0) rotate(-5deg)
    }
}

@-moz-keyframes icon-bounce {

    0%,
    100% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        transform: translate3d(-50%, -80%, 0) rotate(0deg)
    }

    25% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        transform: translate3d(-50%, -80%, 0) rotate(15deg)
    }

    50% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        transform: translate3d(-50%, -80%, 0) rotate(-15deg)
    }

    75% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        transform: translate3d(-50%, -80%, 0) rotate(5deg)
    }

    85% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        transform: translate3d(-50%, -80%, 0) rotate(-5deg)
    }
}

@-o-keyframes icon-bounce {

    0%,
    100% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(0deg);
        transform: translate3d(-50%, -80%, 0) rotate(0deg)
    }

    25% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(15deg);
        transform: translate3d(-50%, -80%, 0) rotate(15deg)
    }

    50% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(-15deg);
        transform: translate3d(-50%, -80%, 0) rotate(-15deg)
    }

    75% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(5deg);
        transform: translate3d(-50%, -80%, 0) rotate(5deg)
    }

    85% {
        -moz-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        -ms-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        -webkit-transform: translate3d(-50%, -80%, 0) rotate(-5deg);
        transform: translate3d(-50%, -80%, 0) rotate(-5deg)
    }
}