.pre_banner_3d a,
.pre_banner_3da a,
.pre_banner_3db a {
    text-decoration: none;
    border: 0;
    position: relative;
    width: 100%;
    display: block;
}

body {
    overflow-x: hidden
}

.pre_banner_3d,
.pre_banner_3da,
.pre_banner_3db {
    margin: auto;
    width: 100%;
    /* height: 440px; */
    height: 320px;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: hidden;
}

.contrves,
.contrvesa,
.contrvesb {
    width: 100%;
    height: auto;
    position: absolute
}

.nav_banners,
.nav_bannersa,
.nav_bannersb {
    width: 100%;
    height: auto;
    border-bottom: 1px solid #f2f2f2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.nav_banners>li,
.nav_bannersa>li,
.nav_bannersb>li {
    display: inline-block;
    padding: 5px 16px;
    margin: 12px 0;
    border-radius: 5px;
    font-size: 14px;
    cursor: pointer
}

/* .blue_nav{background:#63b504;color:#fff} */

.banner_tree,
.banner_treea,
.banner_treeb {
    width: 1040px;
    /* height: 440px; */
    height: 320px;
    position: absolute;
    left: 50%;
    bottom: 0;
    margin-left: -520px;
    overflow: hidden
}

.show_phone_s {
    width: 414px;
    height: 736px;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    z-index: 10
}

.pre_banner_3d .color_font,
.pre_banner_3da .color_fonta,
.pre_banner_3db .color_fontb {
    width: 40px;
    height: 60px;
    position: absolute;
    top: 50%;
    margin-top: -30px;
    cursor: pointer;
    z-index: 99;
}

.pre_banner_3d .left_btn,
.pre_banner_3da .left_btna,
.pre_banner_3db .left_btnb {
    background: url(css_sprites.png) -173px -10px;
}

.pre_banner_3d .right_btn,
.pre_banner_3da .right_btna,
.pre_banner_3db .right_btnb {
    background: url(css_sprites.png) -233px -10px;
}

.left_btn,
.left_btna,
.left_btnb {
    left: 0
}

.right_btn,
.right_btna,
.right_btnb {
    right: 0;
    background-position: -233px -10px;
}

.img_phone {
    width: 100%;
    height: 100%
}

.show_s_ui,
.show_s_uia,
.show_s_uib {
    margin-top: 10px;
    width: 100%;
    height: 100%;
    position: relative
}

.show_s_ui>li,
.show_s_uia>li,
.show_s_uib>li {
    width: 382px;
    /* height: 330px; */
    height: 235px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 30;
    cursor: pointer;
    filter: alpha(opacity=0);
    opacity: 0;
    font-size: 40px;
}

.show_s_ui>li>div,
.show_s_uia>li>div,
.show_s_uib>li>div {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    filter: alpha(opacity=90);
    opacity: .9;
    display: none
}

.show_s_ui>li>img,
.show_s_uia>li>img,
.show_s_uib>li>img {
    width: 100%;
}

#middel_shows {
    width: 462px;
    /* height: 400px; */
    height: 280px;
    left: 290px;
    filter: alpha(opacity=100);
    opacity: 1;
    z-index: 10;
}

#left_shows {
    left: 0;
    filter: alpha(opacity=60);
    opacity: .6;
    z-index: 1;
}

#right_shows {
    left: 659px;
    opacity: .6;
    filter: alpha(opacity=60);
    z-index: 1;
}

#small_left,
#small_right {
    width: 154px;
    height: 249px;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 1;
}

#small_left {
    left: -25%
}

#small_right {
    left: 102.5%;
}

.show_s_ui li .abt,
.show_s_uia li .abt,
.show_s_uib li .abt {
    padding: 8px 15px;
    height: auto;
    background-color: rgba(0, 0, 0, .5);
    text-align: center;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
}

.show_s_ui li .abt h4,
.show_s_uia li .abt h4,
.show_s_uib li .abt h4 {
    margin-bottom: 2px;
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    font-weight: lighter;
}

.show_s_ui li .abt p,
.show_s_uia li .abt p,
.show_s_uib li .abt p,
.show_s_ui li .abt .tip,
.show_s_uia li .abt .tip,
.show_s_uib li .abt .tip {
    color: #fff;
    font-size: 14px;
    line-height: 22px;
}

.show_s_ui li.active .abt,
.show_s_uia li.active .abt,
.show_s_uib li.active .abt {
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
}

.show_s_ui li.active a .abt,
.show_s_uia li.active a .abt,
.show_s_uib li.active a .abt {
    height: auto;
}

.show_s_ui li.active a h4,
.show_s_uia li.active a h4,
.show_s_uib li.active a h4 {
    margin-bottom: 5px;
    font-size: 16px;
    line-height: 22px;
}

.show_s_ui li.active a img,
.show_s_uia li.active a img,
.show_s_uib li.active a img {
    transition: all 1s
}

.show_s_ui li.active a .tip,
.show_s_uia li.active a .tip,
.show_s_uib li.active a .tip {
    font-size: 14px;
    line-height: 22px;
}

/*@media screen and (max-width:1200px){
	.pre_banner_3d{width:1024px;height:763px}
	#middel_shows{left:35.5%}
	.show_s_ui>li{width:175px;height:282px}
	#small_left,#small_right{width:131px;height:194px}
}
@media screen and (max-width:1024px){
	.pre_banner_3d{width:875px;height:765px}
	.show_phone_s{width:375px;height:667px}
	#middel_shows{left:34.8%}
	#middel_shows{width:267px;height:457px}
}
@media screen and (max-width:879px){
	.pre_banner_3d{width:746px;height:735px}
	#middel_shows{left:31.8%}
	#middel_shows{width:269px;height:457px}
	.show_s_ui>li{width:145px;height:232px}
}
@media screen and (max-width:768px){
	.pre_banner_3d{width:675px;height:586px}
	.show_phone_s{width:320px;height:568px}
	#middel_shows{left:33.1%}
	#middel_shows{width:227px;height:389px}
	.show_s_ui>li{width:138px;height:215px}
	#right_shows{left:72%}
	.banner_tree{height:539px}
}
@media screen and (max-width:685px){
	.color_font{display:none}
	#small_left{left:-55%}
	.pre_banner_3d{width:520px}
	#small_right{left:109.5%}
	.show_phone_s{width:300px;height:496px}
	#middel_shows{left:29.7%}
	#middel_shows{width:213px;height:340px}
	#left_shows{left:0%}
	.show_s_ui>li{width:106px;height:190px}
	#right_shows{left:79.5%}
}
@media screen and (max-width:521px){
	.pre_banner_3d{width:359px}
	#left_shows{left:-41%}
	#right_shows{left:107.5%}
	#middel_shows{left:20.4%}
	#middel_shows{width:214px;height:340px}
	.show_phone_s{width:349px;height:568px}
	#middel_shows{left:15.5%}
	#middel_shows{width:246px;height:390px}
}
@media screen and (max-width:359px){
	.pre_banner_3d{width:320px}
	.show_phone_s{width:320px;height:520px}
	#middel_shows{left:14.5%}
	#middel_shows{width:228px;height:356px}
}*/