﻿.proje_wrapper{
  margin:60px 0 70px 0;
}
.proje_con{
  background: url(/Sites/Uploaded/UserUpLoad/20201102/20201102093945.png)no-repeat;
  background-size: cover;
  height: 656px;
  padding-top:56px;
  box-sizing: border-box;
  margin-top: 80px;
}
.proje_mess .pro_item{
  height: 57px;
  position: relative;
  margin-bottom: 40px;
}
.pro_item .item_left{
  padding-left: 126px;
  height: 57px;
  line-height: 57px;
  width: 515px;
  box-sizing: border-box;
}
.proje_mess .pro_item:nth-child(n+7){
  display: none;
}
.pro_item.item1 .item_left{
  background: url(/Content/Areas/Common/images/proje01.png) no-repeat left center;
}
.pro_item.item2 .item_left{
  background: url(/Content/Areas/Common/images/proje02.png) no-repeat left center;
}
.pro_item.item3 .item_left{
  background: url(/Content/Areas/Common/images/proje03.png) no-repeat left center;
}
.pro_item.item4 .item_left{
  background: url(/Content/Areas/Common/images/proje04.png) no-repeat left center;
}
.pro_item.item5 .item_left{
  background: url(/Sites/Uploaded/UserUpLoad/20201030/20201030172415.png) no-repeat left center;
}
.pro_item.item6 .item_left{
  background: url(/Sites/Uploaded/UserUpLoad/20201030/20201030172431.png) no-repeat left center;
}
.left_wrapper{
  padding-right:150px;
  box-sizing: border-box;
}
.pro_item.active .left_wrapper{
  background: url(/Content/Areas/Common/images/projejt.png) no-repeat right center;
}
.pro_item.active .left_wrapper .item_tit{
  color: #1168E3;
}
.left_wrapper a.item_tit{
  font-size: 20px;
  font-family: Microsoft YaHei UI;
  font-weight: bold;
  color: #333333;
  line-height: 26px;
}


.pro_item .item_right{
  display: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1111;
  width: 587px;
  height: 693px;
  overflow: hidden;
}
.pro_item .item_right img{
    width: 100%;
}
.pro_item.active .item_right{
  display: block;
}
.pro_item.item1 .item_right{
  top: -115px;
}
.pro_item.item2 .item_right{
  top: -212px;
}
.pro_item.item3 .item_right{
  top: -309px;
}
.pro_item.item4 .item_right{
  top: -406px;
}
.pro_item.item5 .item_right{
  top: -503px;
}
.pro_item.item6 .item_right{
  top: -600px;
}
.item_right .item_text{
  position: absolute;
  top:240px;
  line-height: 40px;
  text-align: center;
  font-size: 32px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FFFFFF;
  line-height: 26px;
  padding-left: 180px;
}
.item_right .item_text::after{
  position: absolute;
  top: 55px;
  left: 180px;
  content: "";
  width: 100px;
  height: 3px;
  background: #FFFFFF;
}

.item_right .item_p_wrapper{
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 162px;
    display: block;
    background: rgba(0, 75, 170, 0.9) url(/Content/Areas/Common/images/projejt1.png) no-repeat 498px 105px;
    padding: 38px 28px;
    box-sizing: border-box;
    transition: all 0.3s;
}
.item_right p.item_p{
    font-size: 16px;
    font-family: Microsoft YaHei UI;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 22px;

}
.item_right:hover .item_p_wrapper{
  background: rgba(0, 75, 170, 0.9) url(/Content/Areas/Common/images/projejt1.png) no-repeat 508px 105px;
}

.achie_con{
  margin-top: 20px;
}
.achie_ul li{
  float: left;
  position: relative;
  opacity: 0;
  width: 32%;
  height: 250px;
}
.achie_ul li.achie_li1 {
    background:url(/Sites/Uploaded/UserUpLoad/20201102/20201102110839.png)no-repeat;
    background-size: cover;
}
.achie_ul li.achie_li2 {
    background:url(/Sites/Uploaded/UserUpLoad/20201102/20201102110925.png)no-repeat;
    margin: 0 2%;
    background-size: cover;
}
.achie_ul li.achie_li3 {
    background:url(/Sites/Uploaded/UserUpLoad/20201102/20201102110948.png)no-repeat;
    background-size: cover;
}
.achie_ul li .achie_a{
  display: block;
  height: 250px;
  line-height: 250px;
  box-sizing: border-box;
  text-align: center;
  width: 100%;
  font-size: 36px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FFFFFF;
}
.achie_ul li .achie_a img{
    margin-right: 20px;
}

.achie_ul li.infoShow{overflow: visible;opacity: 1;  transition:background-color 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, opacity 800ms ease 0s, transform 800ms ease 0s;}
.achie_ul li:nth-child(1){transition-delay: 0.4s;}
.achie_ul li:nth-child(2){transition-delay: 0.8s;}
.achie_ul li:nth-child(3){transition-delay: 1.2s;}

.achie_ul li .achie_a: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;
}

@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);
}
}

@media only screen and (max-width:768px) {
    .pro_item .item_right{
        display:none !important;
    }
    .proje_con{
        margin-top: 0;
    }
    .achie_ul li{
        height: 220px;
    }
    .achie_ul li .achie_a{
        height: 220px;
        line-height: 220px;
        font-size: 28px;
    }
    .proje_wrapper{
        margin: 20px 0;
    }
}
@media only screen and (max-width:420px) {
    .proje_mess{
        padding:0 15px;
        box-sizing: border-box;
    }
    .achie_ul li{
        height: 180px;
        margin: 5px 0;
        width: 100%;
    }
    .achie_ul li .achie_a{
        height: 180px;
        line-height: 180px;
        font-size: 24px;
    }
    .achie_ul li.achie_li2{
        margin: 5px 0;
    }
    .achie_con{
        margin-top: 0;
    }
}
