@charset "utf-8";
.pagesection.fixedbg-index{
background:url(images/bg-index-s1.jpg) no-repeat center top;
height:880px;
}
.mod-itemlist{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.mod-itemlist .item{
border-width:1px 1px 2px 1px;
border-color:#d5d5d5 #d5d5d5 #e7211e #d5d5d5;
border-style:solid;
width:220px;
padding:30px 0;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.mod-itemlist .item .cont{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
flex: 1 1 auto;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.mod-itemlist .item .cont .icon{
text-align:center;
padding:15px 0 10px;
}
.mod-itemlist .item .cont .icon img{
width:65px;
height:auto;
}
.mod-itemlist .item .cont .icont{
padding:5px 0 30px 0;
}
.mod-itemlist .item .cont .icont h1.title{
font-weight:bold;
font-size:1.8rem;
line-height:2.2;
}
.mod-itemlist .item .cont .icont ul li{
font-size:1.6rem;
line-height:1.8;
}
.mod-itemlist .item .more{
text-align:center;
}
a.btns1{
display:inline-block;
font-size:1.6rem;
line-height:25px;
padding:5px 15px;
border:1px #ccc solid;
border-radius:4px;
color:#a0a0a0;
}
a.btns1:hover{
border:1px #e7211e solid;
background-color:#e7211e;
color:#fff;
}
a.btns1{
-webkit-transition: all 300ms;
-moz-transition: all 300ms;
-ms-transition: all 300ms;
-o-transition: all 300ms;
transition: all 300ms;
}
.siluflow{
min-width:1200px;
width:100%;
background:url(images/bg-p1-s3.jpg) no-repeat center top;
height:625px;
margin:0 auto;
}
.siluflow .siluflow-cont{
width:1200px;
margin:0 auto;
}
.siluflow .siluflow-cont .rightcont{
float:right;
width:510px;
height:625px;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
}
.siluflow .siluflow-cont .rightcont .items{
line-height:85px;
font-size:2.0rem;
color:#fff;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
}
.siluflow .siluflow-cont .rightcont .items .num{
flex:0 0 80px;
}
.siluflow .siluflow-cont .rightcont .items .c{
flex:1 1 auto;
}

.pagesection.fixedbg-about{
background:url(images/bg-p1-s5.jpg) no-repeat center top;
height:466px;
}
.pagesection.fixedbg-about .section .pagetitle .titlemod h1{
color:#fff;
border-bottom:2px #fff solid;
}
.pagesection.fixedbg-about .section .pagetitle .titlemod h2{
color:#e5e5e5;
}
.index-about{
text-align:center;
line-height:3;
color:#fff;
font-size:1.6rem;
}
.pagesection.fixedbg-silutong{
background:url(images/bg-p2-s1.jpg) no-repeat center top;
height:477px;
}
.pagesection.fixedbg-silutong1{
background:url(images/bg-p4-s1.jpg) no-repeat center top;
height:482px;
}
.mod-kunjing{
width:100%;
}
.mod-kunjing .title{
text-align:center;
font-size:3.4rem;
line-height:1.5;
}
.mod-kunjing .title span{
display:inline-block;
padding:0 5px;
border-bottom:2px #e7211e solid;
}
.mod-kunjing .sectitle{
text-align:center;
font-size:3.0rem;
line-height:1.5;
}
.mod-kunjing .sectitle span{
display:inline-block;
padding:0 5px;
color:#e7211e;
}
.mod-kunjing .lrow1{
position:reltive;
padding:10px 0 0 0;
}
.mod-kunjing .lrow1 .aline{
position:relative;
width:1px;
height:30px;
background-color:#a0a0a0;
margin:0 auto;
}
.mod-kunjing .lrow1 .aline .cir{
display:block;
position:absolute;
width:7px;
height:7px;
background-color:#a0a0a0;
border-radius:7px;
left:-3px;
top:0;
z-index:2;
}
.mod-kunjing .lrow2{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.mod-kunjing .lrow2 .items{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
flex:1 1 25%;
}
.mod-kunjing .lrow2 .items .lines{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.mod-kunjing .lrow2 .items .lines .linel{
height:1px;
background-color:#a0a0a0;
flex:1 1 auto;
}
.mod-kunjing .lrow2 .items .lines .aline{
height:35px;
background-color:#a0a0a0;
flex:0 0 1px;
}
.mod-kunjing .lrow2 .items .lines .liner{
height:1px;
background-color:#a0a0a0;
flex:1 1 auto;
}
.mod-kunjing .lrow2 .items .lines.first .linel{
background-color:#f9f9f9;
}
.mod-kunjing .lrow2 .items .lines.last .liner{
background-color:#f9f9f9;
}
.mod-kunjing .lrow2 .items .icon{

}
.mod-kunjing .lrow2 .items .icon .img{
border:2px #e7211e solid;
width:70px;
height:70px;
border-radius:70px;
overflow:hidden;
padding:10px;
margin:0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.mod-kunjing .lrow2 .items .icon .img img{
width:60px;
height:60px;
}
.mod-kunjing .lrow2 .items .icon h1.title{
font-size:2.6rem;
line-height:2;
}
.mod-kunjing .lrow2 .items .kcont{
font-size:1.6rem;
line-height:2;
text-align:center;
padding-top:15px;
}
.pagesection.fixed-hight{
background:url(images/bg-p2-s3.jpg) no-repeat center top;
}
.mod-kunjing .desc{
padding:40px 0;
text-align:center;
font-size:1.6rem;
color:#424242;
line-height:2.5;
}
.mod-kunjing .lrow3{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.mod-kunjing .lrow3 .items{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
-webkit-justify-content: flex-start;
justify-content: flex-start;
width:326px;
padding:10px;
border:1px #ccc solid;
background-color:#f5f5f5;
}
.mod-kunjing .lrow3.fixedjuli .items{
flex:0 0 22%;
}
.mod-kunjing .lrow3.fixedjuli .items img{
width:100%;
height:auto;
}
.mod-kunjing .lrow3 .items .ititle{
padding:20px 0 10px 0;
}
.mod-kunjing .lrow3 .items .ititle span{
display:inline-block;
font-size:2.2rem;
border-bottom:2px #e7211e solid;
line-height:1.5;
}
.mod-kunjing .lrow3 .items .idesc{
padding:0 0 40px 0;
}
.stepdata{
background:url(images/img-step.jpg) no-repeat center top;
height:850px;
position:relative;
}
.stepdata .items{
position:absolute;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: flex-start;
-ms-flex-align: flex-start;
align-items: flex-start;
}
.stepdata .items.mod1{
width:480px;
height:280px;
left:100px;
top:35px;
}
.stepdata .items.mod2{
width:460px;
height:220px;
left:735px;
top:260px;
}
.stepdata .items.mod3{
width:480px;
height:280px;
left:100px;
top:438px;
}
.stepdata .items.mod4{
width:460px;
height:200px;
left:735px;
top:620px;
}
.stepdata .items .t{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: baseline;
-ms-flex-align: baseline;
align-items: baseline;
color:#e7211e;
}
.stepdata .items .t .cn{
display:inline-block;
font-size:2.2rem;
line-height:2;
}
.stepdata .items .t .en{
display:inline-block;
font-size:1.6rem;
line-height:2;
margin-left:10px;
}
.stepdata .items .tcont{
font-size:1.4rem;
line-height:1.8;
}
.pagesection.fixedbg-pstep{
background:url(images/bg-p2-s5.jpg) no-repeat center top;
height:664px;
}
.pagesection.fixedbg-pstep .section .pagetitle .titlemod h1{
border-bottom:2px #f5f5f5 solid;
color:#fff;
}
.part-step{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: flex-start;
-ms-flex-align: flex-start;
align-items: flex-start;
padding-top:230px;
}
.part-step .items:nth-child(1){
flex:1 1 16%;
color:#fff;
font-size:1.6rem;
line-height:1.6;
padding-left:35px;
}
.part-step .items:nth-child(2){
flex:1 1 20%;
color:#fff;
font-size:1.6rem;
line-height:1.6;
padding-left:10px;
}
.part-step .items:nth-child(3){
flex:1 1 30%;
color:#fff;
text-align:center;
font-size:1.6rem;
line-height:1.6;
}
.part-step .items:nth-child(4){
flex:1 1 22%;
text-align:right;
color:#fff;
font-size:1.6rem;
line-height:1.6;
}
.pagesection.fixedbg-haiwaicang{
background:url(images/bg-p3-s1.jpg) no-repeat center top;
height:311px;
}
.pagesection.fixedbg-haiwaicang1{
background:url(images/bg-p3-s2.jpg) no-repeat center top;
height:604px;
}
.pagesection.fixedbg-haiwaicang1 .section .pagetitle .titlemod h1{
border-bottom:2px #f5f5f5 solid;
color:#fff;
}

.whcont{
font-size:1.6rem;
line-height:1.5;
text-align:center;
padding-bottom:50px;
}
.mod-haiwaic{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.mod-haiwaic .items{
width:420px;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.mod-haiwaic .items .img{
text-align:center;
}
.mod-haiwaic .items .img img{
width:400px;
height:auto;
border:1px #d5d5d5 solid;
padding:8px;
background-color:#fff;
border-radius:150px;
}
.mod-haiwaic .items .img h1{
font-size:3.0rem;
padding-top:10px;
}
.mod-haiwaic .items .img h1 span{
display:inline-block;
border-bottom:2px #e7211e solid;
line-height:1.6;

}
.mod-haiwaic .items .desc{
font-size:1.6rem;
line-height:2;
text-align:center;
padding-top:15px;
}
.mod-haiwaic .cir{
padding:80px 20px 0 20px;
}
.hwc-desc{
padding:10px 0;
text-align:center;
color:#fff;
}
.hwc-desc h1{
font-size:2.6rem;
line-height:3;
}
.hwc-desc p{
font-size:1.8rem;
line-height:2;
}

.pagesection.fixedbg-shili{
background:url(images/bg-p4-s1.jpg) no-repeat center top;
height:481px;
}

.pagesection.fixedbg-ability{
background:url(images/bg-p5-s1.jpg) no-repeat center top;
height:311px;
}
.pagesection.fixedbg-contact{
background:url(images/bg-p6-s1.jpg) no-repeat center top;
height:524px;
}
.page-contact{
padding-bottom:50px;
}
.page-contact h1.company{
font-size:1.8rem;
line-height:3;
}
.page-contact p{
font-size:1.6rem;
line-height:2;
margin:0 0 10px 0;
}

.mod-hwcitemlist{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.mod-hwcitemlist .item{
border-width:1px 1px 3px 1px;
border-color:#d5d5d5 #d5d5d5 #ff3300 #d5d5d5;
border-style:solid;
border-radius:5px;
width:21%;
padding:30px 10px 10px 10px;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color:#fff;
box-shadow:0 0 8px rgba(0,0,0,.2);
}
.mod-hwcitemlist .item .cont{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex-direction: column;
flex: 1 1 auto;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.mod-hwcitemlist .item .cont .icon{
text-align:center;
padding:15px 0 10px;
}
.mod-hwcitemlist .item .cont .icon img{
width:150px;
height:150px;
padding:8px;
background-color:#f5f5f5;
border:1px #d5d5d5 solid;
border-radius:100px;
}
.mod-hwcitemlist .item .cont .icont{
padding:5px 0 30px 0;
}
.mod-hwcitemlist .item .cont .icont h1.title{
font-weight:bold;
font-size:1.8rem;
line-height:2.2;
text-align:center;
}
.hwcmapv{
border:10px #e5e5e5 solid;
width:1010px;
margin:0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.hwcmapv .item:first-child{
flex:1 1 50%;
border-right:5px #e5e5e5 solid;
}
.hwcmapv .item:last-child{
flex:1 1 50%;
border-left:5px #e5e5e5 solid;
}

.ossolu{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.ossolu .item{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex:1 1 14.28%;
flex-direction: column;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
        box-sizing: border-box;
border:#ccc solid;
border-width:1px 1px 1px 0;
background-color:#fff;
}
.ossolu .item:first-child{
border:1px #ccc solid;
border-radius:5px 0 0 5px;
}
.ossolu .item:last-child{
border-radius:0 5px 5px 0;
}
.ossolu .item .title{
background-color:#ff6600;
color:#fff;
text-align:center;
font-size:2.2rem;
line-height:60px;
flex:0 0 60px;
}
.ossolu .item:first-child .title{
border-radius:4px 0 0 0;
}
.ossolu .item:last-child .title{
border-radius:0 4px 0 0;
}
.ossolu .item .ocont{
text-align:center;
padding:10px;
flex:1 1 auto;
}
.ossolu .item .ocont ul{
}
.ossolu .item .ocont ul li{
font-size:1.6rem;
line-height:2;
}
.ossolu .item .ocont ul li span.marker{
font-size:2.0rem;
color:#e7211e;
}

.vaslist{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-around;
justify-content: space-around;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.vaslist .item{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex:0 0 265px;
height:470px;
border:5px #fff solid;
box-shadow:0 0 8px rgba(0,0,0,.2);
}
.vaslist .item.hwcbg{
background:#fff url(images/vas1.jpg) no-repeat 0 0;
background-size:100% auto;
}
.vaslist .item.youxuanbg{
background:#fff url(images/vas2.jpg) no-repeat 0 0;
background-size:100% auto;
}
.vaslist .item.xiaodianbg{
background:#fff url(images/vas3.jpg) no-repeat 0 0;
background-size:100% auto;
}
.vaslist .item.fhqbg{
border:5px #f60 solid;
box-shadow:0 0 8px rgba(0,0,0,.2);
background:#fff url(images/vas4.jpg) no-repeat 0 0;
background-size:100% auto;
}
.vaslist .item .icont{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex:1 1 auto;
flex-direction: column;
background-color:rgba(0,0,0,.6);
color:#fff;
}
.vaslist .item .icont h1.title{
font-size:2.2rem;
line-height:60px;
text-align:center;
background-color:rgba(255,255,255,.2);
}
.vaslist .item .icont .exp{
height:150px;
padding:10px;
font-size:1.6rem;
}
.superdesc_1_img{
text-align:center;

}
.superdesc_1{
font-size:1.6rem;
line-height:1.8;
width:80%;
margin:0 auto;
}
.etlist{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.etlist .item{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex:0 0 210px;
flex-direction: column;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
border:#fff 8px solid;
background-color:#fff;
}
.etlist .item .img{
width:100%;
position:relative;
}
.etlist .item .img img{
width:100%;
}
.etlist .item .img .name{
background-color:rgba(0,0,0,.6);
color:#fff;
font-size:1.8rem;
line-height:2.5;
position:absolute;
left:0;
bottom:0;
width:100%;
text-align:center;
}
.etlist .item .intro{
padding:10px 15px;
font-size:1.6rem;
line-height:1.6;
}
.ysfhq{
font-size:1.6rem;
text-align:center;
line-height:2.5;
}
.fhqlist{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
padding-top:40px;
}
.fhqlist .item{
flex:0 0 280px;
border:5px #fff solid;
box-shadow:0 0 8px rgba(0,0,0,.2);
}
.fhqlist.fixed2{
-webkit-justify-content: space-around;
justify-content: space-around;
}
.fhqlist.fixed2 .item{
flex:0 0 500px;
}
.fhqlist .item img{
width:100%;
height:auto;
}
.fhqlist.fixed2 .item h1{
text-align:center;
font-size:1.6rem;
line-height:2.5;
}



.hwcimg{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
flex-wrap:wrap;
}
.hwcimg .item{
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
flex:1 1 auto;
overflow:hidden;
height:310px;
position:relative;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
        box-sizing: border-box;
border:#e5e5e5 solid;
border-width:5px 5px 5px 0;
cursor:pointer;
}
.hwcimg .item.hwcp1{background:url(images/c-xian.jpg) no-repeat center top;background-size:auto 100%;border:5px #e5e5e5 solid;}
.hwcimg .item.hwcp2{background:url(images/c-mosike.jpg) no-repeat center top;background-size:auto 100%;}
.hwcimg .item.hwcp3{background:url(images/c-alamutu.jpg) no-repeat center top;background-size:auto 100%;}
.hwcimg .item.hwcp4{background:url(images/c-kalaganda.jpg) no-repeat center top;background-size:auto 100%;}
.hwcimg .item.hwcp5{background:url(images/c-xiboliya.jpg) no-repeat center top;background-size:auto 100%;border:#e5e5e5 solid;border-width:0 5px 5px 5px;}
.hwcimg .item.hwcp6{background:url(images/c-neibu1.jpg) no-repeat center top;background-size:auto 100%;border:#e5e5e5 solid;border-width:0 5px 5px 0;}
.hwcimg .item.hwcp7{background:url(images/c-neibu2.jpg) no-repeat center top;background-size:auto 100%;border:#e5e5e5 solid;border-width:0 5px 5px 0;}
.hwcimg .item.hwcp8{background:url(images/c-jieke.jpg) no-repeat center top;background-size:auto 100%;border:#e5e5e5 solid;border-width:0 5px 5px 0;}

.hwcimg .item .name{
width:100%;
background-color:rgba(0,0,0,.3);
height:36px;
line-height:36px;
text-align:center;
color:#fff;
position:absolute;
left:0;
bottom:0;
}
.hwcimg .item:hover .name{
background-color:rgba(0,0,0,.65);
}
.hwcimg .item.hwcp1:hover{flex:0 0 450px;}
.hwcimg .item.hwcp2:hover{flex:0 0 530px;}
.hwcimg .item.hwcp3:hover{flex:0 0 450px;}
.hwcimg .item.hwcp4:hover{flex:0 0 530px;}
.hwcimg .item.hwcp5:hover{flex:0 0 530px;}
.hwcimg .item.hwcp6:hover{flex:0 0 530px;}
.hwcimg .item.hwcp7:hover{flex:0 0 520px;}
.hwcimg .item.hwcp8:hover{flex:0 0 530px;}

.hwcimg .item,.hwcimg .item .name{
-webkit-transition: all 600ms;
-moz-transition: all 600ms;
-ms-transition: all 600ms;
-o-transition: all 600ms;
transition: all 600ms;
}
.pagesection .section .pagetitle .sfollow{
position:absolute;
left:100px;
top:0;
border:8px rgba(0,0,0,.3) solid;
height:80px;
width:80px;
border-radius:80px;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color:rgba(255,255,255,.8);
}
.pagesection .section .pagetitle .sfollow span{
font-size:6rem;
color:#e7211e;
}









	<div class="pagetitle">
			<div class=""><span>1</span></div>