/*--------------------------------------------------------------------pic2*/
/*--------------------------------------------------------tite*/
.pic2text{
   width:29%;
   height:100%;
   float:left;
   display:table;
   margin-left: 15%;
}
.pic2textin{
   display:table;
   display:table-cell;
   vertical-align: middle;
   opacity: 0;
   animation: myfirst 0.7s;
   animation-delay:2.5s;
   animation-fill-mode: forwards;
   animation-direction:alternate;
}
.pic2textin h1{
   font-size:50px;
   color:#808080;
   border-bottom: 2px solid #808080;
   box-sizing: border-box;
   text-shadow: 1px 1px 1px #000000;
}
.pic2tite{
   font-size:30px;
   color:#808080;
   text-shadow: 1px 1px 1px #000000;
   margin-bottom: 13%;
}
/*--------------------------------------------------------tite*/
/*--------------------------------------------------------img*/
.pic2img{
   background-repeat:no-repeat;
   background-size:66.8%;
   background-position:center 90%;
   height:100%;
   width:37.3%;
   margin-right:15%;
   float: right;
}
.pic2cadimg{
   background-size: 100%;
   background-repeat: no-repeat;
   height:41%;
   width: 40%;
   margin-top: 73.1%;
   margin-left: auto;
   margin-right: auto;
   overflow:hidden;
   display: table;
   text-align: center;
}
.pic2cadimg img{
   width:97%;
   height:97%;
   margin-top: -150%;
   animation: myfirst3 13s;
   /*animation-delay:3s;*/
   animation-fill-mode: forwards;
   animation-play-state:paused;
   box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.5);
}
/*--------------------------------------------------------img*/
/*--------------------------------------------------------animate*/
@keyframes myfirst{
    0%{transform: translate3d(0px, 30px, 0px);opacity: 0;}
    100%{transform: translate3d(0px, 0px, 0px);opacity: 1;}
}
@keyframes myfirst3{
    0%{margin-top:-150%;}
    100%{margin-top:0%;}
}
/*--------------------------------------------------------animate*/
/*--------------------------------------------------------------------pic2*/
/*--------------------------------------------------------------------pic3*/
/*--------------------------------------------------------tite*/
.pic3text{
   width:31%;
   height:100%;
   float:left;
   display:table;
   margin-left: 15%;
}
.pic3textin{
   display:table;
   display:table-cell;
   vertical-align: middle;
   opacity: 0;
   animation: myfirst 0.7s;
   /*animation-delay:2.5s;*/
   animation-fill-mode: forwards;
   animation-play-state:paused;
}
.pic3textin h1{
   font-size:45px;
   color:#ffffff;
   text-shadow: 1px 1px 1px #000000;
   letter-spacing: -2px;
}
.pic3tite{
   font-size:20px;
   color:#ffffff;
   text-shadow: 1px 1px 1px #000000;
   margin-bottom: 8%;
}
.pic3tite2{
   font-size:16px;
   color:#ffffff;
   text-shadow: 1px 1px 1px #000000;
   margin-bottom: 13%;
}
/*--------------------------------------------------------tite*/
/*--------------------------------------------------------------------pic3*/
/*--------------------------------------------------------------------pic4*/
.abgne_tab{
    width:100%;
    height:100%;
}
.pic4ocelist{
   width:100%;
   height:100%;
   position: absolute;
   z-index: 10;
}
.pic4ocelistin{
   width: 480px;
   height: 38px;
   border: 1px solid #fff;
   border-radius: 5px;
   margin-left:auto;
   margin-right:auto;
   background: rgba(0,0,0,0.5);
   overflow: hidden;
   margin-top: 42%;
}
.pic4oce1{
   float: left;
   width: 160px;
   height: 38px;
   margin-left: -1px;
   line-height: 38px;
   border-left: 1px solid #fff;
   color: #fff;
   font-size: 16px;
   text-align: center;
   cursor: pointer;
   background-color:rgba(255,255,255,0.3);
}
.pic4oce2{
   float: left;
   width: 160px;
   height: 38px;
   margin-left: -1px;
   line-height: 38px;
   border-left: 1px solid #fff;
   color: #fff;
   font-size: 16px;
   text-align: center;
   cursor: pointer;
}
.pic4oce3{
   float: left;
   width: 160px;
   height: 38px;
   margin-left: -1px;
   line-height: 38px;
   border-left: 1px solid #fff;
   color: #fff;
   font-size: 16px;
   text-align: center;
   cursor: pointer;
}
/*-----------------------------------*/
.pic4textlist{
   width:300%;
   height:100%;
   transition:all 1s cubic-bezier(0.86, 0, 0.07, 1);
}
.pic4text1{
   width:33.3333%;
   height:100%;
   display:inline-block;
   background-color:#cc0033;
}
.pic4text2{
  width:33.3333%;
  height:100%;
  display:inline-block;
  background-color:#d2d2d2;
}
.pic4text3{
  width:33.3333%;
  height:100%;
  display:inline-block;
  background-color:green;
}
.pku1{
  transform: translate3d(0px, 0px, 0px);
}
.pku2{
  transform: translate3d(-33.3333%, 0px, 0px); 
}
.pku3{
  transform: translate3d(-66.6666%, 0px, 0px);  
}
/*--------------------------------------------------------------------pic4*/
/*--------------------------------------------------------------------pic5*/
.abgne_tab{
    width:100%;
    height:100%;
}
.pic5ocelist{
   width:100%;
   height:100%;
   position: absolute;
   z-index: 10;
}
.pic5ocelistin{
   width: 480px;
   height: 38px;
   border: 1px solid #fff;
   border-radius: 5px;
   margin-left:auto;
   margin-right:auto;
   background: rgba(0,0,0,0.5);
   overflow: hidden;
   margin-top: 42%;
}
.pic5oce1{
   float: left;
   width: 160px;
   height: 38px;
   margin-left: -1px;
   line-height: 38px;
   border-left: 1px solid #fff;
   color: #fff;
   font-size: 16px;
   text-align: center;
   cursor: pointer;
   background-color:rgba(255,255,255,0.3);
}
.pic5oce2{
   float: left;
   width: 160px;
   height: 38px;
   margin-left: -1px;
   line-height: 38px;
   border-left: 1px solid #fff;
   color: #fff;
   font-size: 16px;
   text-align: center;
   cursor: pointer;
}
.pic5oce3{
   float: left;
   width: 160px;
   height: 38px;
   margin-left: -1px;
   line-height: 38px;
   border-left: 1px solid #fff;
   color: #fff;
   font-size: 16px;
   text-align: center;
   cursor: pointer;
}
/*-----------------------------------*/
.pic5textlist{
   width:300%;
   height:100%;
   transition:all 1s cubic-bezier(0.86, 0, 0.07, 1);
}
.pic5text1{
   width:33.3333%;
   height:100%;
   display:inline-block;
   background-color:#cc0033;
}
.pic5text2{
  width:33.3333%;
  height:100%;
  display:inline-block;
  background-color:#d2d2d2;
}
.pic5text3{
  width:33.3333%;
  height:100%;
  display:inline-block;
  background-color:green;
}
.pku1{
  transform: translate3d(0px, 0px, 0px);
}
.pku2{
  transform: translate3d(-33.3333%, 0px, 0px); 
}
.pku3{
  transform: translate3d(-66.6666%, 0px, 0px);  
}
/*--------------------------------------------------------------------pic5*/