



.list_banner{ height: 360px; background:url(../img/ad_banner.jpg) center top no-repeat;}

.list_banner a{ display: block; height: 100%;}



.content{ width: 1100px; margin: 0 auto; height: auto; display: block;}

.content_l{ width: 737px; padding-right:40px; border-right: 1px solid #e5e5e5;float: left;}

.list ul li{ height: 125px; padding-top: 25px; border-bottom: 1px dotted #ccc;}

.list ul li img{ width:150px; height: 100px; float: left; margin-right: 25px; border: none;}

.list ul li strong{ height: 32px; line-height: 32px; display: block; overflow: hidden; font-size: 17px; position: relative;}

.list ul li strong a{ color: #444444;}

.list ul li strong a:hover{ color: #4889bb;}

.list ul li p{font-size:14px; color: #888; height: 50px; }

.list ul li i{ font-size: 12px; font-style: normal; color: #999;}

.list ul li strong a b{ line-height: 32px; padding-right:80px; display: block;}

.list ul li strong span{ display: block; font-weight: normal;font-size: 12px; color: #c4c4c4; height: 32px; line-height: 32px; position: absolute;top: 0; right: 0; background:url(../img/list_ic.png) left 10px no-repeat;}

.list ul li strong span a{ padding-left: 18px; color: #999;}

.list ul li strong span a:hover{ padding-left: 18px; color: #fcbb74;background:url(../img/list_ic.png) left -105px no-repeat;}

.list ul li strong em{ color:#ff6c00; font-style: normal;}





.Relevant{ width:735px; height:43px; border: 1px solid #e5e5e5; margin-bottom: 25px; background: #f7f7f7; }

.Relevant span{ width: 160px; height: 43px; display: block; border-right:1px solid #e5e5e5; float: left; line-height: 43px; text-align: center; position: relative; cursor: pointer;}

.Relevant span a{color: #333; display: block; }

.Relevant span.hover{ background: #3b8de3;}

.Relevant span a:hover{ background: #3b8de3; color: #fff;}

.Relevant span.hover a{ color: #fff;}

.Relevant span.hover{ color: #fff;}

.Relevant span.hover i{ width: 160px; height: 6px;background:url(../img/jt.png) center top no-repeat; position: absolute; left: 0; bottom: -6px;}

.Relevant_txt{width:735px; height: auto; padding-bottom: 30px; overflow: hidden;}

.Relevant_txt ul{ width: 780px;}

.Relevant_txt ul li{ float: left; width: 370px;height: 30px; overflow: hidden; line-height: 30px; margin-right:20px; font-size: 14px;}

.Relevant_txt ul li a{ color: #444;}

.Relevant_txt ul li img{ margin-right:5px;}



.content_r{ width:292px; height: auto; float: right;}



/*新闻右侧活动幻灯图*/

.newsFocus { width: 292px; height: 350px; margin-top: 30px;  position: relative;}

.newsFocus .bd { height: 350px; overflow: hidden; }

.newsFocus .bd ul { overflow: hidden; }

.newsFocus .bd ul li { width: 292px; height: 350px; float: left; }

.newsFocus .bd ul li img { width:292px; height:350px; display: block;}

.newsFocus .bd ul li p { font-size: 12px; line-height: 18px; color: #666666; padding: 10px 10px 0;}

.newsFocus .hd { width: 292px; height: auto; overflow: hidden; position: absolute; bottom:10px;}

.newsFocus .hd ul {  margin-left:88px}

.newsFocus .hd ul li { width: 40px; height: 6px; float: left; background: #000000; margin-right: 2px; cursor: pointer;}

.newsFocus .hd ul li.on { background: #fcbb74;}



.lxwm{ width: 292px; height: 425px; margin:30px 0 20px 0; }

.lxwm p.lx{width: 100%;height: 54px; line-height: 54px; text-align: center;background: #3b8de3;color: #fff;box-sizing: border-box;font-size: 20px;}

.lxwm .lx span{margin-left: 20px;margin-right: 20px;}

.lxwm_yygh{ border: 1px solid #e5e5e5; width: 290px; height: 370px;}

.lxwm form{color: #3b8de3;font-size: 15px;padding-left:18px; padding-top: 10px;}

.lxwm form input.st{width: 168px;height: 34px;border: 1px solid #3b8de3; }

.lxwm form .txt1{width: 168px;height: 34px;border: 1px solid #3b8de3;}

.lxwm form li{margin-top: 11px;}

.lxwm form li p{ width:80px; float: left;}

.lxwm form textarea{border: 1px solid #3b8de3;width: 263px;resize: none;margin-left: 18px;height: 100px;}

.lxwm .btn{ padding: 25px 0 0 0;}

.lxwm .btn_l{width: 123px;height: 42px; background: #3b8de3; text-align: center; margin-right: 10px; float: left; color: #fff;}

.lxwm .btn_c{width: 123px;height: 42px; background: #fcbb74; text-align: center;float: left; color: #fff;}







.mfrx{ width: 292px; height: 202px;}

.mfrx .mfrx_pic{ width: 292px; height: 91px; display: block;}

.mfrx ul{ width: 290px; height:108px;border: 1px solid #e5e5e5;}

.mfrx ul li{ width:95px; text-align: center; float: left;}

.mfrx ul li a{ display: block; padding-top: 20px; color: #444; font-size: 14px;}

.mfrx ul li a:hover{ color:#3b8de3;}





/*---------------文章------------*/



.article_article{ padding: 0 30px;}

.article_article .h1{ font-size: 24px; line-height: 30px; padding:30px 0 5px 0;}

.wzly{ font-size: 13px; color: #999; padding-bottom:20px; margin-bottom: 30px; border-bottom: 1px solid #ededed;}





.bodyText{ padding:10px 0px 20px 0px; font-size:14px; line-height:26px; letter-spacing:0.5px}

.bodyText p{ margin-bottom:15px;}

.bodyText p a {color:blue; text-decoration: underline;}

.bodyText p a:hover {color:red;}

.bodyText img{ max-width: 100%;}
.bodyText p img{ max-width: 100%;}

.nextPage{font-size: 14px; height:auto; padding:15px 0 30px 0; line-height:24px;  color:#888888;}

.nextPage a{ color: #444; }

.nextPage a:hover{ color: #f00;}





/*---------------近视手术栏目页------------*/



/*banner*/

.banner{ width:100%; height:600px; position:relative; overflow:hidden;}

.banner .bannerContent { margin:0 auto; position:relative; z-index:0; overflow:hidden;  }

.banner .bannerContent ul{ width:100% !important;  }

.bannerContent li{ width:100% !important;  height:600px; overflow:hidden;  }





.banner .bannerF { width:200px;  position:absolute; z-index:1; bottom:10px; left:45%; height:30px; line-height:30px; }

.banner .bannerF  ul{ text-align:center; }

.banner .bannerF  ul li{ display:inline-block; margin:0 5px; width:15px; height:15px; border-radius: 50%; background: #fff;opacity:0.7;filter:alpha(opacity=70); line-height:999px; overflow:hidden; }

.banner .bannerF  ul li.on{ line-height:999px; background: #3d8ee3;opacity:0.7;filter:alpha(opacity=70);}

.banner .prev{ position:absolute; top:40%; left:5%; width:47px; height:93px; background:url(../img/banner_left.png) no-repeat; cursor:pointer; z-index:1000;}

.banner .next{ position:absolute; top:40%; right:4%; width:47px; height:93px; background:url(../img/banner_right.png) no-repeat; cursor:pointer; z-index:1000;}



.banner ul li .bannerLink{ width:100%; height:600px;}

.banner ul li .bannerLink a{ width:100%; height:600px; display:block;}









/*栏目页---标题*/

.jsss_bk{ width: 1100px; margin:0 auto; padding-top: 35px; height: auto;}

.jsss_bt{ text-align: center; font-size: 30px; color: #444; font-weight: bold; padding-bottom: 20px; line-height: 50px;}

.jsss_bt1{ padding-bottom: 0; }

.jsss_bt span{ color:#3d8ee3; }





/*栏目页---通栏1爆款设备*/

.jsss_bk_c{ padding-left: 2px;}

.jsss_bk_c ul li{ width: 240px; padding: 11px; height: 300px; float: left; margin-right: 15px; background: #fff; box-shadow:0 0 5px 2px #eee; position: relative;}

.jsss_bk_c ul li.ic1{ margin-right: 0; }

.jsss_bk_c ul li img{ width: 240px; height:151px; display: block;}

.jsss_bk_c ul li strong{ display: block; font-weight: normal;text-align: center; font-size: 20px; line-height: 24px; padding: 15px 0 5px 0;}

.jsss_bk_c ul li p{ text-align: center; height: 55px; padding: 0 10px; font-size: 14px; color: #777;}

.jsss_bk_c ul li span{ width: 240px; display: block; position: absolute; bottom: 25px;}

.jsss_bk_c ul li span a{ width: 140px;height:  35px; margin: 0 auto; line-height: 35px; border: 1px solid #3d8ee3;display: block; color: #3d8ee3; text-align: center;}









/*栏目页---科室介绍*/



.list_ksys{ width: 1100px; margin: 0 auto; padding: 50px 0; overflow: hidden;}

.list_ksys dl.dl1{height: auto; overflow: hidden;}

.list_ksys dl.dl1 img{ float: left;width: 458px; height: 311px; margin-right: 25px;}

.list_ksys dl.dl1 dt{ font-size:26px; color: #444444; font-weight: bold; line-height: 50px;}

.list_ksys dl.dl1 dd p{ font-size: 16px; color: #666666; text-indent: 2em; line-height: 35px; padding-bottom: 10px;}

.list_ksys dl.dl1 dd p.ic1{ padding-bottom: 0;}



.list_ksys ul.ul1{height: auto; overflow: hidden; padding-top: 25px;}

.list_ksys ul.ul1 li{ width: 163px; height: 163px; border: 1px solid #dadada; margin-left:22px; float: left; border-radius: 10px; text-align: center;}

.list_ksys ul.ul1 li.ml0{ margin-left: 0;}

.list_ksys ul.ul1 li img{ display: block; margin: 0 auto; padding-top: 10px;}

.list_ksys ul.ul1 li strong{ display: block; font-size: 18px; font-weight: normal;line-height:28px; color: #333333;}

.list_ksys ul.ul1 li p{ font-size: 14px; color: #999999; padding-top: 5px;}



.list_ksys ul li:hover img {

  -webkit-animation: icon-bounce 0.5s alternate;

  -moz-animation: icon-bounce 0.5s alternate;

  -o-animation: icon-bounce 0.5s alternate;

  animation: icon-bounce 0.5s alternate;

}







.jsss_bt_fu{ width: 1100px; margin: 0 auto;text-align: center; line-height:30px; height: 30px;}

.jsss_bt_fu img{ display: block; float: left; padding-right: 5px;}

.jsss_bt_fu img.pl{  padding-left:330px;}

.jsss_bt_fu span{ float: left; padding-right: 50px;}





/*栏目页---流程*/

.jsss_liucheng{width: 1100px; margin: 0 auto; padding: 30px 0 50px 0; overflow: hidden;}

.jsss_liucheng_l{ width:450px; height: 340px; float: left; margin-right: 28px; overflow: hidden;}



.jsss_liucheng_r{ width: 1100px;/*width: 618px;  float: left;*/}

.jsss_liucheng_r ul li{height:64px;/* height:84px;*/ padding-left: 5px;border-bottom: dotted  1px #d4d4d4; position: relative; cursor: pointer;}

.jsss_liucheng_r ul li span{ /*font-size:20px; */color: #333333; font-weight: bold;line-height: 30px; /*display: block;*/ float: left; padding-top: 12px;}

.jsss_liucheng_r1 ul li span{ padding-top: 7px;}

.jsss_liucheng_r ul li p{ padding-top:13px;font-size: 15px;line-height: 30px;  color: #666;}



.jsss_liucheng_r ul li.on em{ width: 7px; height: 37px;background:url(../img/lanmu/jsss_lc_bj.jpg) center top no-repeat; position: absolute; left: -7px; top: 20px;  }

.jsss_liucheng_r ul li.on span{ color:#3b8de3 ;}

.jsss_liucheng_r ul li.on p{ color:#3b8de3 ;}











/*————————————栏目页---专科门诊绿色通道————————————*/

.jsss_lstd{ width: 1098px; margin: 0 auto 50px auto; height: auto; overflow: hidden; border: 1px solid #e6e6e6;}

.jsss_lstd1{ width:219px; float: left; text-align: center; height: 278px; border-right: 1px solid #e6e6e6;}

.jsss_lstd1 img{ display: block; padding-top: 58px; margin: 0 auto;}

.jsss_lstd1 strong{ display: block; font-weight: normal; font-size: 20px; color: #444444; line-height: 24px; padding: 10px 0 2px 0;}

.jsss_lstd1 p{ line-height: 20px; font-size: 15px;  color: #bcbcbc;}

.jsss_lstd3{ border: 0;}

.jsss_lstd2{ width: 438px;ext-align: center; height: 278px; float: left; border-right: 1px solid #e6e6e6;}

.jsss_lstd2_1{width: 438px; height:139px; border-bottom:  1px solid #e6e6e6;}

.jsss_lstd2_1 p{ width: 235px; float: left; padding-top: 55px; line-height: 28px; font-size: 20px; color: #444444; text-align: right;}

.jsss_lstd2_1 span{ padding-top: 20px; display: block; float: left;}



.jsss_lstd2_2{width: 218px; height:138px; text-align: center; float: left; border-right:  1px solid #e6e6e6;}

.jsss_lstd2_2 span{ display: block; padding-top: 23px;}

.jsss_lstd2_2 span img{display: block; margin: 0 auto;}

.jsss_lstd2_2 p{font-size: 20px; color: #444444;}



.jsss_lstd2_3{ border: 0;}



/*.jsss_lstd2_2:hover img {

  -webkit-animation: icon-bounce 0.5s alternate;

  -moz-animation: icon-bounce 0.5s alternate;

  -o-animation: icon-bounce 0.5s alternate;

  animation: icon-bounce 0.5s alternate;

}*/









.jsss_sfw{ width: 1100px; height: auto; overflow: hidden; margin: 0 auto ; padding-bottom: 30px;}

.jsss_sfw ul{ width: 1200px;}

.jsss_sfw ul li{ width: 255px; height: 300px; float: left; padding-right: 36px; overflow: hidden;}









/*白内障栏目页*/

.bnz_kp{ width: 1100px; margin:0 auto 50px auto; height: auto; overflow: hidden;}

.bnz_kp_img{ width: 450px; height: 340px; position: relative; float: left;}

.bnz_kp_img img{width: 450px; height: 340px;}

.bnz_kp_img p{ width: 450px; height: 40px; line-height: 40px; font-size: 16px; text-align: center;background:url(../img/lanmu/bj.png); color: #fff; position: absolute; left: 0; bottom: 0;}





.bnz_kp ul{ width: 615px; float: right; margin-right: 5px;}

.bnz_kp ul li{ width:615px; line-height: 42px; line-height: 41px; border-bottom: 1px dotted #dfdfdf;}

.bnz_kp ul li a{ color:#333;}

.bnz_kp ul li a:hover{ color:#6caaeb;}

.bnz_kp ul li a span{ color: #ff6c00;}

.bnz_kp ul li a:hover span{ color: #f00;}













/*斜弱视栏目页*/



.list_ksys1{ width: 1100px; height: auto; padding: 40px 0 20px 0; overflow: hidden;}

.list_ksys1 dl.dl2{ width:525px; float: left;}

.list_ksys1 dl.dl3{ float: right;}

.list_ksys1 dl.dl2 dt{ width: 525px; height:50px; border-bottom: 1px solid #e2dede; line-height: 50px; font-size: 24px; color: #444; font-weight: bold; position: relative; text-indent: 10px; margin-bottom: 20px;}

.list_ksys1 dl.dl2 dt em{  width: 3px; height: 22px; background: #3b8de3; position: absolute; left: 0; bottom: 13px;}

.list_ksys1 dl.dl2 dt span{ position: absolute;height:50px;border-bottom: 2px solid #3b8de3;left: 0; bottom: -1px;}

.list_ksys1 dl.dl2 dd img{ float: left; width: 252px; height:273px; margin-right: 14px;}

.list_ksys1 dl.dl2 dd p{ font-size: 16px; color: #737272; line-height: 29px; text-indent: 2em;}





.xrs_liuchengbj{ background: #f6f6f6; height: auto; overflow: hidden; margin-bottom:40px; padding-top: 30px;}

.jsss_bt_fu_xrs{ line-height: 20px; color: #646464; font-size: 17px; text-align: center;}





.xrs_zongzhi{ width: 1100px; margin: 10px auto 50px auto; height: auto; overflow: hidden;}

.xrs_zongzhi ul li{ width:341px; height: 212px; float: left;background:url(../img/lanmu/xrs_bj01.jpg) bottom center no-repeat; color: #fff; margin-right: 38px;}

.xrs_zongzhi ul li.bj2{background:url(../img/lanmu/xrs_bj02.jpg) bottom center no-repeat; }

.xrs_zongzhi ul li.bj3{background:url(../img/lanmu/xrs_bj03.jpg) bottom center no-repeat; margin: 0;}

.xrs_zongzhi ul li strong{ display: block; padding-top: 83px; line-height: 40px; text-align: center; font-size: 25px;}

.xrs_zongzhi ul li.bj2 strong{padding-top: 58px; }

.xrs_zongzhi ul li.bj3 strong{padding-top: 38px; }

.xrs_zongzhi ul li strong span{ padding: 0 15px;}

.xrs_zongzhi ul li p{ padding: 0 42px; line-height: 25px; font-size: 16px;}





.xw{display: flex;justify-content: center;}

.xw div{ margin:30px 0 50px 17px;}

.xw div:first-child{background: url(../img/lanmu/xrs_aq_1.jpg) no-repeat top center;height: 408px;width: 262px; margin-left: 0;}

.xw div:nth-child(2){background: url(../img/lanmu/xrs_aq_2.jpg) no-repeat top center;height: 408px;width: 262px;}

.xw div:nth-child(3){background: url(../img/lanmu/xrs_aq_3.jpg) no-repeat top center;height: 408px;width: 262px;}

.xw div:last-child{background: url(../img/lanmu/xrs_aq_4.jpg) no-repeat top center;height: 408px;width: 265px;}

.xw p{width: 212px;color: #fff;margin-top: 148px;margin-left: 24px; font-size: 15px; line-height: 28px;}

.xw p:last-child{margin-top: 10px;}

.xw .ys{color: #896008;text-indent: -42px;width: 170px;margin-left: 66px;}









/*-----------医院介绍-----------*/



.about_yyjj{ width: 1100px; margin:30px auto 0 auto; height: auto; }

.about_yyjj_nav{ height: 50px; line-height: 50px; border-bottom: 1px solid #e5e5e5;}

.about_yyjj_nav h2{ float: left; width: 280px;height: 50px; color: #333; position:relative;}

.about_yyjj_nav h2 strong{ font-weight: normal;border-bottom: 2px solid #3286e1;line-height: 50px;position: absolute; left: 0; bottom: -1px;}

.about_yyjj_wz{ float: right; color: #666666; font-size: 14px;}

.about_yyjj_wz a{ color: #666;}

.about_yyjj_wz a:hover{ color: #3286e1;}



.about_yyjj_txt1{ height: auto; padding-bottom: 50px; overflow: hidden;}

.about_yyjj_txt1 p.p1{ font-size: 15px; color: #666; line-height: 28px; text-indent: 2em; padding:20px 30px;}

.about_yyjj_yy{ width: 803px; padding-left: 7px; float: left;}

.about_yyjj_yy li{ width:243px; height: 287px; float: left; margin-left:24px; position: relative;}

.about_yyjj_yy li p{ width: 223px; height:50px; background:url(../img/lanmu/bj.png);line-height: 19px; font-size: 14px; color: #fff; position: absolute; left: 0; bottom: 0; padding:8px 10px 0 10px;}





.three_border{ width:240px; padding-right: 20px; float: right;}

.wid{	width: 100%;display: flex;justify-content: flex-start;align-items: center;margin-top: 15px;}

.wid .txt p span{font-size: 15px;color: #313131;}

.wid .txt{ padding-left:8px;}

.wid .txt p{font-size: 22px; line-height: 22px; color: #272727;}

.wid .txt p.adress{font-size: 14px;}

.wid:last-child{	justify-content: space-between;font-size: 14px;	text-align: center; }

.wid a{color: #666; text-align: center; }

.wid a img{ margin-right: 0; }





/*-----------医院介绍--绿色通道-----------*/

.jsss_bt_bjc{ font-weight: normal; font-size: 26px;}

.about_lstd{ width: 808px; float: left; margin-bottom: 30px; height: auto;}

.about_lstd ul li{ width:250px; height: 176px; text-align: center; float: left; margin:0 15px 15px 0; background: #3b8de3; box-shadow: 0px 0px 15px #e0e0e0;}

.about_lstd ul li span{ display: block; padding-top:20px;}

.about_lstd ul li strong{ display: block; color: #fff; padding-bottom: 10px; font-size: 22px; line-height: 24px; font-weight: normal;}

.about_lstd ul li p{ width: 150px; font-size: 15px; border: 1px solid #8abbee; background: #579de7; margin: 0 auto; line-height: 31px; color: #fff;}

.about_lstd ul li.bj2{ background: #80c269;}

.about_lstd ul li.bj2 p{border: 1px solid #b3dba5; background: #92cb7e;}

.about_lstd ul li.bj3{ background: #f59e03;}

.about_lstd ul li.bj3 p{border: 1px solid #f9c568; background: #f6ac27;}



.about_lstd ul li:hover span img {

  -webkit-animation: icon-bounce 0.5s alternate;

  -moz-animation: icon-bounce 0.5s alternate;

  -o-animation: icon-bounce 0.5s alternate;

  animation: icon-bounce 0.5s alternate;

}





.about_yyjj_lxwm{ float: right; width:292px; height:367px; margin-top: 0; box-shadow: 0px 0px 15px #e0e0e0; }

.about_yyjj_lxwm .lxwm_yygh{ border: 0;}

.about_yyjj_lxwm  form li{ margin-top: 9px;}

.about_yyjj_lxwm .btn{ padding-top: 20px;}



/*-----------医院介绍--品牌发展大事件-----------*/



.about_ppfz{ width: 1040px; margin: 0 auto;background:url(../img/lanmu/yyjj_bj.jpg) repeat-x 0 56px; padding: 0 30px; height: auto;}

.swiper{position: relative;}

/*左右箭头*/

.prev1,.next1{ width:25px; height: 25px;  position: absolute;color: #fff;z-index: -1px;top: 44px;-webkit-touch-callout: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}

.prev1:hover{background:url(../img/lanmu/jt.png) no-repeat;}

.prev1{background:url(../img/lanmu/jt.png) no-repeat 0 -38px;  left: -30px;}

.next1{background:url(../img/lanmu/jt.png) no-repeat 0 -115px;  right: -30px;}

.next1:hover{background:url(../img/lanmu/jt.png) no-repeat 0 -77px;}

/*左右中间的内容*/

.swiper-slide strong{ width:105px; height: 136px;background:url(../img/lanmu/yyjj_faic_bj1.png) no-repeat; display: block; margin: 0 auto;font-size:26px; color: #fff; text-align: center; font-weight: normal; padding-top: 15px; }

.swiper-slide strong em{ width:86px; height: 86px; line-height: 86px; border-radius: 50%; margin: 0 auto;background: #3687dd; display: block; font-style: normal;}

.swiper-slide strong.bj2 em{background:#55a5aa;}

.swiper-slide strong.bj3 em{background:#e0c486;}

.swiper-slide strong.bj4 em{background:#088a47;}

.swiper-slide strong:hover em{background:#377ec7;}

.swiper-slide strong.bj2:hover em{background:#419499;}

.swiper-slide strong.bj3:hover em{background:#c7a65e;}

.swiper-slide strong.bj4:hover em{background:#076a37;}

.swiper-slide p{ font-size: 14px;  text-indent: 2em; color: #555; line-height: 20px; padding-top:10px; }



/*-----------医院介绍--服务与承诺-----------*/



.about_fwcl{ width: 1100px; height: auto; margin: 50px auto; padding:25px 0 30px 0; box-shadow: 0px 0px 15px #e0e0e0; }

.about_fwcl_js{ padding: 0 30px;}

.about_fwcl_js p{ line-height:27px; font-size: 15px; color: #666; text-indent: 2em; padding-bottom: 10px;}

.about_fwcl ul.ul1{ height: auto; padding: 10px 0 0 30px; overflow: hidden;}

.about_fwcl ul.ul1 li{ width: 331px; height: 217px; float: left; padding-right: 23px;}





.about_fwcl_nav{ width: 1100px; height: auto; overflow: hidden; margin: 30px auto 0 auto; padding-bottom: 40px;}

.about_fwcl_nav ul li{ float: left; width:274px; height: 226px; position: relative;}

.about_fwcl_nav ul li i{ width: 100%; height: 89px; display: block; position: absolute; left: 0; top: 50px; text-align: center; }

.about_fwcl_nav ul li strong{width: 100%; height:35px; color: #fff; font-weight: normal;line-height: 35px; text-align: center;position: absolute; left: 0; top: 142px; font-size: 18px;}

.about_fwcl_nav ul li.li1{ width: 275px; height: 452px;}

.about_fwcl_nav ul li.li1 i{top: 268px;}

.about_fwcl_nav ul li.li1 strong{top: 369px;}



.about_fwcl_nav ul li span{ display: block; width: 100%; height: 100%; }

.about_fwcl_nav ul li span.bj1{  background: #e5ca8f;}

.about_fwcl_nav ul li span.bj2{ background: #55a5aa;}

.about_fwcl_nav ul li span.bj3{ background: #377ec7;}



.about_fwcl_nav ul li:hover i img {

  -webkit-animation: icon-bounce 0.5s alternate;

  -moz-animation: icon-bounce 0.5s alternate;

  -o-animation: icon-bounce 0.5s alternate;

  animation: icon-bounce 0.5s alternate;

}





































/* animation */

@keyframes icon-bounce {

  0%, 100% {

    -moz-transform: rotate(0deg);

    -ms-transform: rotate(0deg);

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

  }



  25% {

    -moz-transform: rotate(15deg);

    -ms-transform: rotate(15deg);

    -webkit-transform: rotate(15deg);

    transform: rotate(15deg);

  }



  50% {

    -moz-transform: rotate(-15deg);

    -ms-transform: rotate(-15deg);

    -webkit-transform: rotate(-15deg);

    transform: rotate(-15deg);

  }



  75% {

    -moz-transform: rotate(5deg);

    -ms-transform: rotate(5deg);

    -webkit-transform: rotate(5deg);

    transform: rotate(5deg);

  }



  85% {

    -moz-transform: rotate(-5deg);

    -ms-transform: rotate(-5deg);

    -webkit-transform: rotate(-5deg);

    transform: rotate(-5deg);

  }

}

@-webkit-keyframes icon-bounce {

  0%, 100% {

    -moz-transform: rotate(0deg);

    -ms-transform: rotate(0deg);

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

  }



  25% {

    -moz-transform: rotate(15deg);

    -ms-transform: rotate(15deg);

    -webkit-transform: rotate(15deg);

    transform: rotate(15deg);

  }



  50% {

    -moz-transform: rotate(-15deg);

    -ms-transform: rotate(-15deg);

    -webkit-transform: rotate(-15deg);

    transform: rotate(-15deg);

  }



  75% {

    -moz-transform: rotate(5deg);

    -ms-transform: rotate(5deg);

    -webkit-transform: rotate(5deg);

    transform: rotate(5deg);

  }



  85% {

    -moz-transform: rotate(-5deg);

    -ms-transform: rotate(-5deg);

    -webkit-transform: rotate(-5deg);

    transform: rotate(-5deg);

  }

}

@-moz-keyframes icon-bounce {

  0%, 100% {

    -moz-transform: rotate(0deg);

    -ms-transform: rotate(0deg);

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

  }



  25% {

    -moz-transform: rotate(15deg);

    -ms-transform: rotate(15deg);

    -webkit-transform: rotate(15deg);

    transform: rotate(15deg);

  }



  50% {

    -moz-transform: rotate(-15deg);

    -ms-transform: rotate(-15deg);

    -webkit-transform: rotate(-15deg);

    transform: rotate(-15deg);

  }



  75% {

    -moz-transform: rotate(5deg);

    -ms-transform: rotate(5deg);

    -webkit-transform: rotate(5deg);

    transform: rotate(5deg);

  }



  85% {

    -moz-transform: rotate(-5deg);

    -ms-transform: rotate(-5deg);

    -webkit-transform: rotate(-5deg);

    transform: rotate(-5deg);

  }

}

@-o-keyframes icon-bounce {

  0%, 100% {

    -moz-transform: rotate(0deg);

    -ms-transform: rotate(0deg);

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

  }



  25% {

    -moz-transform: rotate(15deg);

    -ms-transform: rotate(15deg);

    -webkit-transform: rotate(15deg);

    transform: rotate(15deg);

  }



  50% {

    -moz-transform: rotate(-15deg);

    -ms-transform: rotate(-15deg);

    -webkit-transform: rotate(-15deg);

    transform: rotate(-15deg);

  }



  75% {

    -moz-transform: rotate(5deg);

    -ms-transform: rotate(5deg);

    -webkit-transform: rotate(5deg);

    transform: rotate(5deg);

  }



  85% {

    -moz-transform: rotate(-5deg);

    -ms-transform: rotate(-5deg);

    -webkit-transform: rotate(-5deg);

    transform: rotate(-5deg);

  }

}



















