﻿



.conTitle01,.pageCatTitle{font-size: 40px;line-height: 60px;}
.catTitle01,.conTitle01,.pageCatTitle,.conTitle01Des,.con01Des,.pageCatTitle,.pageCatTitleDes,.catTitle01Des{text-align: center;}
.conTitle01Des,.con01Des,.pageCatTitleDes,.catTitle01Des{width: 80%;margin: 0 auto}
.catTitle01,.catTitle02{font-size: 26px}
.catTitle02Des{line-height: 30px; margin-top: 20px}
.catTitle01Des{padding-top: 15px;}
.cat01Btn{width: 63% ; margin: 0 auto}
.conTitle01{margin-top:30px}
.conTitle01Des{margin-top: 10px;line-height: 30px}
.con01Des{margin-top: 40px;line-height: 30px}

.caseRel{ color: #fff;padding-bottom: 100px}
.caseRel .conTitle01{margin-top: 60px}
.caseRel .picList{margin-top: 30px; }
.caseRel .picList li{padding: 0 20px; margin-bottom: 10px}
.caseRel .picList li a{color: #fff}
.caseRel .picList li .picDes{text-align: center;background: #c63e20;padding: 0 20px 20px 20px;transition: all 0.6s; }
.caseRel .picList li .picBox{overflow: hidden}
.caseRel .picList li:hover .picDes,.caseRel .picList li.on .picDes{background:#dee415; color: #090909 }
.caseRel .picList li:hover img,.caseRel .picList li.on  img{transform: scale(1.2)}
.caseRel .picList li .title{font-size: 20px; padding: 20px 0 10px 0;}
.caseRel .picList li img{width: 100%;transition: all 0.6s}
.caseRel .picListBox{position: relative}
.caseRel .picListBox .turnIoc{background: url("../images/case_turnioc.png") no-repeat; width: 70px; height: 181px; position: absolute;top: 50%;margin-top: -80px; display: block; opacity: 0.5;transition: opacity 0.6s;cursor: pointer}
.caseRel .picListBox .turnIoc:hover{opacity: 1}
.caseRel .picListBox .rightTurnIoc{right: -130px; background-position-x: -123px}
.caseRel .picListBox .leftTurnIoc{left: -130px}
.caseRel .flexslider .flex-direction-nav a{width: 70px!important; height: 181px!important; position: absolute;top: 50%;margin-top: -80px; display: block; opacity: 0.5;}
.caseRel .flexslider .flex-prev{background: url("../images/case_turnioc.png")!important;}
.caseRel .flexslider .flex-next{background: url("../images/case_turnioc.png")!important; background-position-x: -123px!important;}


.m_kfc ul li{ width:300px; float:left; margin-left:10px; margin-right:10px; text-align:center; margin-top:30px;}


.caseCenter {background: url("../images/ps_sections01_02.png") no-repeat center  top;}
.caseCenter .caseCenterRel{margin-top:24px; padding-bottom: 50px;}
.caseCenter .caseCenterRel li{position: relative;overflow: hidden}
.caseCenter .caseCenterRel li .absoluteMiddle{padding: 80px 10px;}
.caseCenter .caseCenterRel li .mask{ z-index:2;background-color: hsla(160,0%,0%,.65);position: absolute;margin: auto;color: #FFFFFF; text-align: center;width: 100%; height: 100%;top: 100%}
.caseCenter .caseCenterRel li .mask2{position: absolute;margin: auto;color: #FFFFFF; text-align: center;width: 100%; height: 100%;z-index: 1}
.caseCenter .caseCenterRel li:hover .mask{top:0}
.caseCenter .caseCenterRel li a{color: #fff}
.caseCenter .caseCenterRel li .title{font-size: 20px;font-weight: bold; margin-bottom: 10px}
.caseCenter .caseCenterRel li .titleNum{font-size: 50px;line-height: 50px; margin-bottom: 10px;font-weight: bold;transition: all 0.4s}
.caseCenter .caseCenterRel li:hover .titleNum,.caseCenter .caseCenterRel li:hover .titleMore{transform: scale(1.2)}
.caseCenter .caseCenterRel li .titleMore{font-size: 30px;font-weight: bold;margin-bottom: 10px;transition: all 0.4s}
.caseCenter .caseCenterRel li .fa{font-size: 30px; margin-top: 5px}
.caseCenter .caseCenterRel li img{width: 100%;transition: all 0.6s;}
.caseCenter .caseCenterRel li:hover img{transform:scale(1.2);}
.caseCenter .caseCenterRel .ccr2{background: #ff2c00;transition: all 0.4s}
.caseCenter .caseCenterRel .ccr2:hover{background: #ff7b07}
.caseCenter .caseCenterRel .ccr3{background: #004587;transition: all 0.4s}
.caseCenter .caseCenterRel .ccr3:hover{background:#13bbbe }
.caseCenter .caseCenterRel .ccr4{background:#009564;transition: all 0.4s}
.caseCenter .caseCenterRel .ccr4:hover{background:#036a78 }
.caseCenter .fahuo{padding-bottom:20px;background:url("../images/xcbg1.jpg");}
.caseCenter .picList01Area{position: relative}
.caseCenter .fahuo .conTitle01{margin-top: 30px}
/*案例列表*/
.caseList .caseListBox{padding-bottom: 40px}
.caseList .picList02Area{margin-top: 30px;}
/*案例展示*/
.caseShow{}
.caseShow .caseShowBox{background-color: #efeeec;padding-top: 30px;padding-bottom: 30px}
.caseShow .caseShowBox .rightText .title{font-size: 30px;padding-bottom: 10px; line-height: 40px; border-bottom:1px dotted #ccc;margin-bottom: 10px}
.caseShow .caseShowBox .rightText .titieName{font-size: 18px;font-weight: bold;margin-bottom: 10px}
.caseShow .caseShowBox .rightText .titleDes{margin-bottom: 10px}
.caseShow .caseShowBox .rightText .itemList{margin-bottom: 20px}
.caseShow .caseShowBox .rightText .itemName{font-weight: bold}
.caseShow .caseShowBox .rightText .itemCon{padding-right: 5px}
.caseShow .caseShowBox .rightText .customer .ioc{font-size: 25px}
.caseShow .caseShowDetial .caseShowNav{background: #074488;}
.caseShow .caseShowDetial .caseShowNav li .navConBox{text-align: center;padding: 20px 35px;color: #fff;transition: all 0.4s }
.caseShow .caseShowDetial .caseShowNav li .navConBox{height: 100%}
.caseShow .caseShowDetial .caseShowNav li:last-child{margin-right: 0;color: #fff;padding-top: 20px}
.caseShow .caseShowDetial .caseShowNav li a{color: #fff}
.caseShow .caseShowDetial .caseShowNav li.on .navConBox,.caseShow .caseShowDetial .caseShowNav li:hover .navConBox{background:#ff2c00}
.caseShow .caseShowDetial .caseShowNav .ioc{font-size: 35px}
.caseShow .caseShowDetial .caseShowNav .navName{font-size: 20px;}
.caseShow .caseShowDetial .caseShowNav .telIoc{font-size: 50px;position: relative; bottom: -5px}
.caseShow .caseShowDetial .caseShowNav .telCon{font-size: 30px;font-style: italic;color:#ffdf05;font-weight: bold }
.caseShow .caseShowDetial .caseShowNav .telName{font-size: 30px;}
.caseShow .caseShowDetial .navListMobile{position: relative;text-align: center;color: #fff}
.caseShow .caseShowDetial .navListMobile .title{font-size: 30px;}
.caseShow .caseShowDetial .navListMobile .titleDes{padding-top: 10px}
.caseShow .caseShowDetial .navListMobile img{width: 100%;}
.caseShow .caseShowDetial .caseShowConBox .caseShowCon{padding-top: 50px;line-height: 30px}
.caseShow .caseShowDetial .caseShowCon img{max-width: 100%}
.caseShow .caseShowDetial .relPro{padding-bottom: 30px}
.caseShow .caseShowDetial .catTitle{font-size: 25px;padding: 20px 0}
.caseShow .caseShowDetial .relCase{background: url("../images/xcbg.jpg"); padding-top: 1px;padding-bottom: 30px}
.caseShow .caseShowDetial .relCase .picList01{margin-top: 0}


