/*声音*/
body{width: 100%;overflow: hidden;}
.audio-con { position: absolute; left: 10px; top: 10px; width: 30px; height: 30px; z-index: 6; }
.audio-con-on { background: url('../images/audio_on.png') no-repeat; background-size: 100% 100%; -webkit-animation: loading-rotate 2s linear infinite; animation: loading-rotate 2s linear infinite; }
.audio-con-off { background: url('../images/audio_off.png') no-repeat; background-size: 100% 100%; }

#fb5 #fb5-footer { height: 12vw; max-height: 60px; }
.clearfix:after { content: ""; clear: both; display: block; }

#fb5 ul li a{display: block;}
#fb5 #fb5-container-book ul li img{display: block;max-width: 100%;}
#fb5 ul.p2{width: 694px;display: block;margin: 0 auto;position: absolute;top: 331px;left: 52px;}
#fb5 ul.p2 li{width: 50%;float: left;margin-bottom: 35px;}

#fb5 ul.p3{width: 496px;position: absolute;top: 246px;left: 126px;}

#fb5 ul.p4{width: 694px;position: absolute;top: 236px;left: 28px;}
#fb5 ul.p4 li{width: 329px;float: left;display: block;}
#fb5 ul.p4 li:nth-child(2n){float: right;}
#fb5 li a p{color: #000000;font-size: 20px;line-height: 1.8;text-align: center;}

#fb5 .pp5{position: absolute;top: 242px;left: 28px;width: 693px;z-index: 7;}
#fb5 .pp5 li{float: left;display: block;margin-bottom: 10px;}
#fb5 .pp5 .ps2{margin-left: 100px;}
#fb5 .pp5 .ps2 li{width: 259px;margin-right: 45px;margin-bottom: 20px;float: left;}
#fb5 .pp5 .ps2 li a{position: relative;}
#fb5 .pp5 .ps2 li a:after{content: "";display: block;width: 50%;height: 50%;right: 0;bottom: 39px;background: #ccc;position: absolute;z-index: -2;right: -3px;}
#fb5 .pp5 .ps2 li:nth-child(2n){margin-right: 0;}
#fb5 .pp5 .ps2 li img{box-shadow: 4px 6px 2px #ccc;margin-bottom: 5px;}
#fb5 .ps3 {margin-left: 88px;}
#fb5 .ps3 li{width: 199px;margin-right: 8px;margin-bottom: 20px;float: left;font-size: 15px;}
#fb5 .ps3 li a>img{margin-bottom: 20px;display: block;    width: 100%;}
#fb5 .ps3 li:nth-child(3n){margin-right: 0;}
#fb5 .ps3:nth-child(1){margin-top: 274px;}

#fb5 .ps3 dl dt{margin-bottom: 5px;}
#fb5 .ps3 dl dt img{height: 30px;display: block;margin: 0 auto;width: auto;}
#fb5 .ps3 dl dd a{color: #000;}
#fb5 .ps3 dl dd{text-indent:53px;line-height: 1.5;}

.box-group{position: absolute;right: 0;z-index: 6;top: -25%;width: 10.6vw;height: 23.4vw;z-index: 6;}
.box-group2{left: auto;top: auto; right: 0;bottom: 0;}
.box-group .box{border:2px solid #f5f5f5 !important;width: 100%;height:100%;position: absolute;left: 0;top: 0;}
.b1{transform: rotate(60deg);animation: pl 15s 1s infinite;}
.b2{transform: rotate(75deg);animation: pll 15s 2s infinite;}
.b3{transform: rotate(-15deg);animation: plll 15s 3s infinite;}
.b4{transform: rotate(-60deg);animation: pllll 15s 6s infinite;}

@keyframes pl{
    0%{transform:rotate(60deg);}
    50%{transform:rotate(360deg);}
    100%{transform:rotate(60deg);}
}
@keyframes pll{
    0%{transform:rotate(75deg);}
    50%{transform:rotate(360deg);}
    100%{transform:rotate(75deg);}
}
@keyframes plll{
    0%{transform:rotate(-15deg);}
    50%{transform:rotate(360deg);}
    100%{transform:rotate(-15deg);}
}
@keyframes pllll{
    0%{transform:rotate(-60deg);}
    50%{transform:rotate(360deg);}
    100%{transform:rotate(-60deg);}
}
@media screen and (max-width: 640px){
    .box-group{width: 39%;height: 35vw;right: 0;left: auto;top: -15vw;overflow: visible !important; }
    .box-group.box-group2{width: 60%;height: 30vw;bottom: 0;top: auto;}
}