@charset "gb2312";
/* CSS Document */

.banner .banner_con{ background:url(../images/banner.jpg) no-repeat center; height:509px;}
.ybsyb_con{ width:1190px; margin:55px auto; font-size: 14px; overflow:hidden;}
.ybsyb_l{ float: left}
.ybsyb_l li{ margin-bottom: 10px; background: #eee; overflow: hidden;}
.yb120 li{ width: 385px; height: 140px; float: left; margin-left:5px; margin-right: 5px;}
.ybsyb_l li .ybcl i{ background:#f1584e;}
.ybsyb_l li:nth-child(1) .ybcl i,.ybsyb_l li:nth-child(10) .ybcl i{ background:#70ad47;}
.ybsyb_l li:nth-child(2) .ybcl i,.ybsyb_l li:nth-child(11) .ybcl i{ background:#f1584e;}
.ybsyb_l li:nth-child(3) .ybcl i,.ybsyb_l li:nth-child(12) .ybcl i{ background:#357afb;}
.ybsyb_l li:nth-child(4) .ybcl i,.ybsyb_l li:nth-child(13) .ybcl i{ background:#ea802b;}
.ybsyb_l li:nth-child(5) .ybcl i,.ybsyb_l li:nth-child(14) .ybcl i{ background:#70ad47;}
.ybsyb_l li:nth-child(6) .ybcl i,.ybsyb_l li:nth-child(15) .ybcl i{ background:#f1584e;}
.ybsyb_l li:nth-child(7) .ybcl i,.ybsyb_l li:nth-child(16) .ybcl i{ background:#ee99b6;}
.ybsyb_l li:nth-child(8) .ybcl i,.ybsyb_l li:nth-child(17) .ybcl i{ background:#7e82bf;}
.ybsyb_l li:nth-child(9) .ybcl i,.ybsyb_l li:nth-child(18) .ybcl i{ background:#357afb;}


.ybsyb_l li .ybcl i{ margin-top: 10px}

.ybcl,.ybcr{ width:auto; overflow: hidden; transition: ease 0.5s all}
.ybcl{ padding:20px 15px;}
.ybcr{ padding:10px 15px;}

.ybcl i{width: 80px; height: 80px; font-style: normal; display: block; float: left; text-align: center; line-height: 80px; font-size: 30px; color: #fff; border-radius: 50%}

.ybcl p{ width: 255px; padding: 5px 0 0; float: right;}
.ybcl p b{display: block; font-size: 18px; margin-bottom: 10px}


.ybcr img{width: 130px; height: 80px; float: left;}
.ybcr p{ width: 208px; float: right;}
.ybcr b{display: block;}
.ybcr i{display: block; width: 160px; height: 35px; margin:10px 0 0; line-height: 35px; border-radius: 20px; background: #f1584e; font-size: 16px; color: #fff; font-style: normal; text-align: center; cursor: pointer;}
.ybcr i:hover{ background: #357afb}

.ybsyb_l li:hover .ybcl{ margin-top:-140px}

.ybsyb_l li.on{ color: #fff;}
.ybsyb_l li.on .ybcl i{ background: #fff}


.ybsyb_l li:nth-last-child(2) p b strong{display: inline-block; font-size: 14px; font-weight: lighter; border-radius: 5px; background: #ea802b; color: #fff; padding: 2px 5px; margin-left: 5px}
.ybsyb_l li:nth-last-child(3) p b strong{display: inline-block; font-size: 14px; font-weight: lighter; border-radius: 5px; background: #ee99b6; color: #fff; padding: 2px 5px; margin-left: 5px}
.ybsyb_l li:nth-child(8) p b strong{display: inline-block; font-size: 14px; font-weight: lighter; border-radius: 5px; background: #7e82bf; color: #fff; padding: 2px 5px; margin-left: 5px}

.ybsyb_l li:nth-child(4).on{ background: #ea802b;}
.ybsyb_l li:nth-child(4).on i{ background: #fff; color: #ea802b}
.ybsyb_l li:nth-child(7).on{ background: #ee99b6;}
.ybsyb_l li:nth-child(7).on i{ background: #fff; color: #ee99b6}
.ybsyb_l li:nth-child(8).on{ background: #7e82bf;}
.ybsyb_l li:nth-child(8).on i{ background: #fff; color: #7e82bf}



.ybsyb_r{ height: 130px; overflow: hidden; padding: 10px; background: #eee;}
.ybsyb_r li{ margin-bottom: 10px; overflow: hidden;}
.ybsyb_r img{width: 130px; height: 80px; float: left}
.ybsyb_r p{ padding: 10px; height: 60px;}
.ybsyb_r i{display: block; width: 160px; height: 35px; margin: 0 auto; line-height: 35px; border-radius: 20px; background: #f1584e; font-size: 16px; color: #fff; font-style: normal; text-align: center; cursor: pointer;}
.ybsyb_r i:hover{ background: #357afb}
.ybs120r{ padding: 45px 10px}