.head{ background:#fff; position:fixed; z-index:101;}
.fp-section.fp-table, .fp-slide.fp-table{ display:block;}
.head .menu{ border-bottom:0;}
.fp-tableCell{ vertical-align:top; overflow:hidden; display:block;}
.fp-section.fp-table, .fp-slide.fp-table{ overflow:hidden;}

.zz{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:3; background:url(../img/zz2.png) repeat; opacity:1;}
.loading{ position:fixed; left:0; top:0; width:100%; height:100%; background:#fff url(https://www.fotile.com/Public/Home/img/global/loading.gif) no-repeat center center; z-index:1009;}
.bgPic{ float:left;}
.po{ position: absolute; left:0; top:0;}

body,html{ overflow:hidden;}

.proBox .gif{ position:absolute; left:-10%; bottom:0; height:100%; }
.proBox .gif .po{display:none;}
.zz02{position:absolute; left:0; top:0; width:100%; height:100%; z-index:2;}
.zz02 .po{ display:none;}

.back{ position:absolute; left:50%; top:100px; background:url(../img/close.png) no-repeat center center; width:52px; height:52px; margin-left:-26px; z-index:9; cursor:pointer; z-index:98;}
.back a{ width:100%; height:100%; display:block;}

.proBox .info li p,.proBox .info li:hover p{-moz-transition:all .2s linear; -webkit-transition:all .2s linear; transition:all .2s linear;}
.proBox .info li,.proBox .info li:hover{-moz-transition:background .2s linear; -webkit-transition:background .2s linear; transition:background .2s linear;}


.proList li{ float:left; width:25%; height:50%; overflow:hidden; position:relative;cursor:pointer;}
.proList li .icon{ width:84px; height:104px; position:absolute; left:50%; top:50%; margin-left:-42px; margin-top:-10px; z-index:9; text-align:center; font-size:12px; color:#fff; }
.proList li .icon i{ width:84px; height:84px; background-position:center top; background-repeat:no-repeat; display:block;}
.proList li .icon p{ color:#fff; padding-top:10px; line-height:20px;}
.proList li .n01 i{ background-image:url(../img/product/icon1.png);}
.proList li .n02 i{ background-image:url(../img/product/icon2.png);}
.proList li .n03 i{ background-image:url(../img/product/icon3.png);}
.proList li .n04 i{ background-image:url(../img/product/icon4.png);}
.proList li .n05 i{ background-image:url(../img/product/icon5.png);}
.proList li .n06 i{ background-image:url(../img/product/icon6.png);}
.proList li .n07 i{ background-image:url(../img/product/icon7.png);}
.proList li .n08 i{ background-image:url(../img/product/icon8.png);}

.proBox{ width:100%; height:100%; position:absolute; left:0; top:0; z-index:99; display:none;}
.proBox .info{  position:absolute; left:50%; top:50%; z-index:9;}
.proBox .info li{ width:110px; text-align:center; background-repeat:no-repeat; background-position:center top; padding-top:72px; display:inline-block; color:#000; font-size:13px; cursor:pointer;}
.proBox .close2{ position:absolute; left:50%; bottom:-30px; background:url(../img/close.png) no-repeat center center; width:52px; height:52px; margin-left:-26px; z-index:9; cursor:pointer; opacity:0; filter:alpha(opacity=0);z-index:99;}
.proBox .info li{ position:relative; bottom:-30px; opacity:0;filter:alpha(opacity=0); float:left;}
.proBox .info li p{ margin-top:-10px;}
.proBox .info li .wz{ position:absolute; left:-35px; width:100%; top:100px; line-height:21px; width:180px; font-size:12px; display:none; opacity:0.75; text-align:left;}
.proBox .info li:hover p{ color:#ff8000;}

.pb1 .info{ left:50%; top:46%; width:338px; height:290px; margin-left:-165px; margin-top:0;}
.pb1 .info h1{ background:url(../img/product/01/txt.png) no-repeat center top; height:68px; margin-bottom:60px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb1 .info li.c01{ background-image:url(../img/product/01/c01.png);}
.pb1 .info li.c02{ background-image:url(../img/product/01/c02.png);}
.pb1 .info li.c03{ background-image:url(../img/product/01/c03.png);}
.pb1 .info li.c01:hover{ background-image:url(../img/product/01/c01_hover.png);}
.pb1 .info li.c02:hover{ background-image:url(../img/product/01/c02_hover.png);}
.pb1 .info li.c03:hover{ background-image:url(../img/product/01/c03_hover.png);}


.pb2 .gif{ position:absolute; left:auto; right:-10%; bottom:0; height:100%; }
.pb2 .info{ width:342px; left:50%; top:45%;  margin-left:-170px;}
.pb2 .info h1{ background:url(../img/product/02/txt.png) no-repeat center top; height:100px; margin-bottom:50px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb2 .info li.c01{ background-image:url(../img/product/02/c01.png);}
.pb2 .info li.c02{ background-image:url(../img/product/02/c02.png);}
.pb2 .info li.c03{ background-image:url(../img/product/02/c03.png);}
.pb2 .info li.c01:hover{ background-image:url(../img/product/02/c01_hover.png);}
.pb2 .info li.c02:hover{ background-image:url(../img/product/02/c02_hover.png);}
.pb2 .info li.c03:hover{ background-image:url(../img/product/02/c03_hover.png);}

.pb3 .gif{ position:absolute; left:-10%; bottom:0; height:100%; }
.pb3 .info{ width:342px; left:50%; top:45%;  margin-left:-171px; margin-top:0;}
.pb3 .info h1{ background:url(../img/product/03/txt.png) no-repeat center top; height:115px; margin-bottom:50px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb3 .info li.c01{ background-image:url(../img/product/03/c01.png);}
.pb3 .info li.c02{ background-image:url(../img/product/03/c02.png);}
.pb3 .info li.c03{ background-image:url(../img/product/03/c03.png);}
.pb3 .info li.c01:hover{ background-image:url(../img/product/03/c01_hover.png);}
.pb3 .info li.c02:hover{ background-image:url(../img/product/03/c02_hover.png);}
.pb3 .info li.c03:hover{ background-image:url(../img/product/03/c03_hover.png);}

.pb4 .gif{ position:absolute; left:auto; right:-10%; bottom:0; height:100%; z-index:9;}
.pb4 .info{ width:342px; left:50%; top:45%;  margin-left:-170px; margin-top:0px;}
.pb4 .info h1{ background:url(../img/product/04/txt.png) no-repeat center top; height:115px; margin-bottom:50px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb4 .info li.c01{ background-image:url(../img/product/04/c03.png);}
.pb4 .info li.c02{ background-image:url(../img/product/04/c02.png);}
.pb4 .info li.c03{ background-image:url(../img/product/04/c01.png);}
.pb4 .info li.c01:hover{ background-image:url(../img/product/04/c03_hover.png);}
.pb4 .info li.c02:hover{ background-image:url(../img/product/04/c02_hover.png);}
.pb4 .info li.c03:hover{ background-image:url(../img/product/04/c01_hover.png);}
.pb4 .info li{ color:#fff;}


.pb5 .gif{ position:absolute; left:auto; right:-10%; bottom:0; height:100%; z-index:9;}
.pb5 .info{ width:228px; left:50%; top:45%;  margin-left:-114px; margin-top:0px;}
.pb5 .info h1{ background:url(../img/product/05/txt.png) no-repeat center top; height:125px; margin-bottom:50px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb5 .info li.c01{ background-image:url(../img/product/05/c01.png);}
.pb5 .info li.c02{ background-image:url(../img/product/05/c02.png);}
.pb5 .info li.c01:hover{ background-image:url(../img/product/05/c01_hover.png);}
.pb5 .info li.c02:hover{ background-image:url(../img/product/05/c02_hover.png);}
.pb5 .info li{ color:#fff;}

.pb6 .gif{ position:absolute; left:auto; right:-10%; bottom:0; height:100%; z-index:9;}
.pb6 .info{ width:238px; left:50%; top:46.5%;  margin-left:-118px; margin-top:0px;}
.pb6 .info h1{ background:url(../img/product/06/txt.png) no-repeat center top; height:100px; margin-bottom:50px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb6 .info li.c01{ background-image:url(../img/product/06/c01.png);}
.pb6 .info li.c02{ background-image:url(../img/product/06/c02.png);}
.pb6 .info li.c01:hover{ background-image:url(../img/product/06/c01_hover.png);}
.pb6 .info li.c02:hover{ background-image:url(../img/product/06/c02_hover.png);}
.pb6 .info li{ color:#fff;}

.pb7 .gif{ position:absolute; left:auto; right:-6%; bottom:0; height:100%; z-index:9;}
.pb7 .info{ width:458px; left:50%; top:45%;  margin-left:-229px; margin-top:0px;}
.pb7 .info h1{ background:url(../img/product/07/txt.png) no-repeat center top; height:125px; margin-bottom:50px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb7 .info li.c01{ background-image:url(../img/product/07/c01.png);}
.pb7 .info li.c02{ background-image:url(../img/product/07/c02.png);}
.pb7 .info li.c03{ background-image:url(../img/product/07/c03.png);}
.pb7 .info li.c04{ background-image:url(../img/product/07/c04.png);}
.pb7 .info li.c01:hover{ background-image:url(../img/product/07/c01_hover.png);}
.pb7 .info li.c02:hover{ background-image:url(../img/product/07/c02_hover.png);}
.pb7 .info li.c03:hover{ background-image:url(../img/product/07/c03_hover.png);}
.pb7 .info li.c04:hover{ background-image:url(../img/product/07/c04_hover.png);}

.pb8 .gif{ position:absolute; left:-6%; bottom:0; height:100%; }
.pb8 .info{ width:340px; left:50%; top:45%;  margin-left:-170px; margin-top:0px;}
.pb8 .info h1{ background:url(../img/product/08/txt.png) no-repeat center top; height:125px; margin-bottom:50px; opacity:0;filter:alpha(opacity=0); position:relative; bottom:-30px;}
.pb8 .info li.c01{ background-image:url(../img/product/08/c01.png);}
.pb8 .info li.c02{ background-image:url(../img/product/08/c02.png);}
.pb8 .info li.c03{ background-image:url(../img/product/08/c03.png);}
.pb8 .info li.c01:hover{ background-image:url(../img/product/08/c01_hover.png);}
.pb8 .info li.c02:hover{ background-image:url(../img/product/08/c02_hover.png);}
.pb8 .info li.c03:hover{ background-image:url(../img/product/08/c03_hover.png);}

.pb8 .info li .wz{ width:480px; margin-left:0px;}

.dh2 li .icon i{-webkit-animation:tip 3s infinite linear; animation:tip 3s infinite linear;}
.dh2 li .n2 i,.dh2 li .n4 i{animation-delay:0.3s; -webkit-animation-delay:0.3s;}
.dh2 li .n3 i,.dh2 li .n5 i{animation-delay:0.5s; -webkit-animation-delay:0.5s;}
.dh2 li .n6 i,.dh2 li .n8 i{animation-delay:0.7s; -webkit-animation-delay:0.7s;}
.dh2 li:hover .icon i{animation-play-state:paused; -webkit-animation-play-state:paused; transform: scale(1); -webkit-transform: scale(1);}

.dh2 li:hover .bgPic{transform: scale(1.5); -webkit-transform: scale(1.5);}
.dh2 li .bgPic,.dh2 li:hover .bgPic{-moz-transition:all 5s linear; -webkit-transition:all 5s linear; transition:all 5s linear;}

@keyframes tip{
	0% {transform: scale(1) ;}
	70% {transform:scale(0.75);}
	100% {transform:scale(1);}
}

@-webkit-keyframes tip{
	0% {-webkit-transform: scale(1);}
	70% {-webkit-transform:scale(0.75);}
	100% {-webkit-transform:scale(1s);}
}

.cc{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:101;}