body{font-size: 16px;} 

.w80{width: 90%; margin: 0 auto; max-width: 1400px;}





header{ width: 100%; position: fixed; top: 0; left: 0 ;z-index: 100; color: #fff;}

header .con{ padding: 0 5vw;}

header::before{ width: 100%; height: 1px; transition: all .36s;  background: rgba(255, 255, 255, .15); display: block; content: ''; display: block; content: ''; position: absolute; left: 0; bottom: 0; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }

.toplogo{ filter: grayscale(100%) brightness(500%);   -webkit-filter: grayscale(100%) brightness(500%); }

.oneNav{ white-space: nowrap; line-height: 100px; padding: 0 30px; display: flex ;align-items: center; justify-content: center; font-size: 20px;}.oneNav span{ position: relative;}

li.on .oneNav span::after{ display: block; content: ''; transition: all .36s; width: 100%; height: 3px; background-color: #fff; position: absolute; left: 0; bottom: 0; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }

.oneNav:hover{ color: var(--blue);}

.toptel,.topSearch{ height: 50px; border-radius: 25px; background: rgba(255, 255, 255, .15); -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; -o-border-radius: 25px; }

.topSearch{ width: 50px;}

nav li { position:relative; } 

nav li ul { 
display:none; 
position:absolute; 
top:100px; 
left:0; 
width:100%;
 background:#FFF;
} 

nav li li{ text-align:center; line-height:40px;}
nav li li a{ font-size:14px; display:block; color:#333;}
nav li li a:hover{ background:#00488a; color:#FFF;}





.topsearchBox{ width: 300px; position: absolute;   top: 115px;right: 5vw;  box-shadow: 0 5px 10px rgba(0, 0, 0, .1);}

.topsearchKey{ width: calc(100% - 60px); height: 60px; } 

.topsearchSubmit{background: url(../images/searchbtn-w.png) no-repeat center center var(--blue) ;background-size: 30% auto; height: 60px; width: 60px;}

.topsearchBox{ visibility:hidden; opacity:0; filter:alpha(opacity=0);  transform: translateY(10px); -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); }

.topSearch:hover .topsearchBox{ visibility:visible; opacity:1; filter:alpha(opacity=100); transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); }





header.scroll{color: #333; box-shadow: 0 0 10px rgba(0, 0, 0, .15);}

header.scroll::before{ height: 100%; background-color: #fff;}

header.scroll .toplogo{ filter: grayscale(0%) brightness(100%); -webkit-filter: grayscale(0%) brightness(100%); }

header.scroll .toptel,header.scroll .topSearch{ background: rgba(0, 0, 0, .1);}

header.scroll  li.on .oneNav { color: var(--blue);}

header.scroll  li.on .oneNav span::after{ background-color: var(--blue);}





.h_nav{ height: 60px; width: 60px;  padding: 18px 8px ;    align-items: flex-end; z-index: 105;  }

.h_nav.close{align-items: center; justify-content: center;}

.h_nav .burger{ width: 100%;  height: 1px ; background: #fff;  transition: .8s; display:inline-block;       }

.h_nav .burger:first-child{ animation: long 2s linear infinite; -webkit-animation: long 2s linear infinite; }

.h_nav .burger:nth-of-type(2){  width: 50%;}

.h_nav .burger:nth-of-type(3){ animation: long 3s linear infinite; -webkit-animation: long 3s linear infinite; }

.h_nav.close .burger:first-child{ display: none;}

.h_nav.close .burger:nth-of-type(3){ display: none;}

.h_nav.close .burger:nth-of-type(2) {    position: relative;    z-index: 1; width: 80%;}

.h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      content: '';   position: absolute;      top: 0;      left: 0;      width: 100%;      height: 100%;      background: #fff;      opacity: 0;      z-index: 1;}

.h_nav.close .burger:nth-of-type(2) {    background: transparent;    transform: rotate(-180deg); }

.h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      opacity: 1;      transition: all .3s; }

.h_nav.close .burger:nth-of-type(2):before {     transform: rotate(45deg); }   .h_nav .burger:nth-of-type(2):after {     transform: rotate(-45deg); }



/* banner */

 

.banImg{   }

.banner .swiper-slide{overflow: hidden;}

.banner .list{width:100%;height: 100%;}

.banner .swiper-button-next,.banner .swiper-button-prev{transition:opacity .5s;}

.banner .list .list_wrap.before img{ transition: 2s linear 0s; transform:scale(1.08) ; -webkit-transform:scale(1.08) ; -moz-transform:scale(1.08) ; -ms-transform:scale(1.08) ; -o-transform:scale(1.08) ; }

.banner .list .list_wrap.after img{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }

/* .banner .btn{ position: absolute; left: 5vw; bottom: 40px; z-index: 20;}

.banner .btn .prev,.banner .btn .next{ width: 65px;  height: 65px;}

.banner .btn .prev:hover,.banner .btn .next:hover{ background-color: var(--orange); color: #fff;} */

.banner .swiper-pagination{ bottom: 50px;}

.banner .swiper-pagination .swiper-pagination-bullet{ border: 1px solid #fff; opacity: 1; background-color: transparent; width: 12px; height: 12px; margin: 0 7px; }

.banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ background-color: #fff;}





.moreIcon{ height: .8em}

.idxMore{ white-space: nowrap; height:60px; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; }

.idxMore::after{ width: 0; height: 100%; position: absolute; left: 0; top: 0; display: block; content: ''; transition: all .36s; background: var(--blue); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }

.idxMore:hover::after{ width: 100%;}

.idxMore:hover{ color: #fff; box-shadow: 0 0 0 5px rgba(16, 51, 115, .2);  }

.idxMore:hover .moreIcon{filter: grayscale(100%) brightness(500%);}

.idxMore-white .moreIcon{filter: grayscale(100%) brightness(500%);}

.idxProUl .left{  width: 56%;}

.idxProUl .right{  width: calc((100% - 56%) - 40px);}

.idxProUl .left li .img{ height: 300px;}

.idxProUl li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }

.maximg img{ max-width: 100%; max-height: 100%;}

.idxProUl li{ background: url(../images/idxproulbg.jpg) no-repeat bottom left #f9f9f9;}

.idxProUl li .more{ border-bottom: 2px solid #000; width: 120px;}

.linka a:hover{ color: var(--blue);}

.idxProUl li:hover .more{ transform: translateX(15px); -webkit-transform: translateX(15px); -moz-transform: translateX(15px); -ms-transform: translateX(15px); -o-transform: translateX(15px); }

.idxProUl li:hover .more .arrowPrev{ transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }

.idxProUl li:hover{ box-shadow: 0 0 10px rgba(16, 51, 115, .2);}

.idxProUl .left li:first-child{ margin-bottom: 40px;}

.idxProUl .left li:first-child .txt{ padding-left: 0;}

.idxProUl .left li:nth-child(2) a{ flex-direction: row-reverse; }

.idxProUl .left li:nth-child(2)  .txt{ padding-right: 0;}

.idxProUl .right li .line-clamp3{width: calc(100% - 150px);}



.idxAbout{ background: url(../images/idxaboutbg.jpg) no-repeat center bottom; background-size: cover;}

.idxAbout::before{ width: 50%; height: 100%; display: block; content: ''; position: absolute ; right: 0; top: 0; background: url(../images/aboutimg.jpg); background-size: cover;}

.newsItem .img img{  width: 100%; height: 300px; object-fit: cover;}

.newsItem .tit span{

    /*text-decoration: underline;

    */background-image: linear-gradient(currentColor 0, currentColor 0);

    background-image: linear-gradient(currentColor 0 0);

    background-position: 0 calc(100% - 1px);

    background-size: 0 1px;

    background-repeat: no-repeat;

    transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

    -webkit-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

    -moz-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

    -ms-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

    -o-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

  }

.newsItem:hover .tit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}

/*.newsItem:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }*/

.newsItem:hover .more{ transform: translateX(20px); -webkit-transform: translateX(20px); -moz-transform: translateX(20px); -ms-transform: translateX(20px); -o-transform: translateX(20px); }



.swbutton{ width: 65px; height: 65px; color: #aaa;}

.swbutton:hover{ background: var(--blue); color: #fff;}

/* .idxPartner .swiper-container{ height: 450px;}

.idxPartner .swiper-container .swiper-slide{ height: calc((100% - 48px) / 3);}

.idxPartner .swiper-container .swiper-slide:hover{ transform: scale(0.95); box-shadow: 0 0 10px rgba(16, 51, 115, .15); -webkit-transform: scale(0.95); -moz-transform: scale(0.95); -ms-transform: scale(0.95); -o-transform: scale(0.95); }

.idxPartner .swiper-container .swiper-slide img{max-width: 100%; max-height: 100%;} */

.idxPartnerUl li{ width: calc((100% - 120px)/6); margin-right: 24px; margin-bottom: 24px; height: 140px;}

.idxPartnerUl li:nth-child(6n){ margin-right: 0;}

.idxPartnerUl li:hover{ transform: scale(0.95); box-shadow: 0 0 10px rgba(16, 51, 115, .15); -webkit-transform: scale(0.95); -moz-transform: scale(0.95); -ms-transform: scale(0.95); -o-transform: scale(0.95); }







.idxZx{ background: url(../images/zxbg.jpg) no-repeat center center; background-size: cover; background-attachment: fixed;}

footer{ background: #282f36; color: #fff;}

.footlogo{filter: grayscale(100%) brightness(500%);}

footer .top{ border-color: rgba(255, 255, 255, .15);}

footer dd{ font-size: 14px;}

.footEwm img{ width: 120px;}

.profile{ background: url(../images/profilebg.jpg) no-repeat bottom center; background-size: 100% auto;}

.profilePlay{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }

.profilePlay img{ animation: rotate 10s linear infinite; transition: ease 1s; -webkit-animation: rotate 10s linear infinite; }

.cultureUl li{ width: 24%;}

.cultureUl li .txt{ width: 100%; position: absolute; bottom: 0; left: 0; background: rgba(0, 0, 0, .56);top: 80%;  }

.cultureUl li .txt .dd{opacity: 0; }

 

.cultureUl li:hover .txt{  background: rgba(16, 51, 115, .8); top: 40%; }

.cultureUl li:hover .dd{ opacity: 1;}



.history{ background: url(../images/historybg.jpg) no-repeat center bottom; background-size:cover;   background-attachment: fixed; position: relative;  overflow:hidden; height:auto;}

.history::after{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; display: block; content: ''; background-image: linear-gradient(to top,rgba(24,90 ,178, 0.8),transparent); }

.clound {width: 100%;height: 590px;z-index: 2; position: absolute;left: 0;bottom: 0;background: url(../images/cloundy.png) repeat-x left center;-webkit-animation: animate-cloud 30s linear infinite;animation: animate-cloud 30s linear infinite;}

.history-top .years{ font-size: 220px;  } 

.history-top  .img{ width: 450px;}

.history-thumbs .yuan{ width: 40px; height: 40px;}

.history-thumbs .yuan i{ display: block; width:20%  ; height: 20%;}

.history-thumbs .yuan::after{ width: 100%; transform: scale(0); transition: all .36s; height: 100%; position: absolute; left: 0%; top: 0%; background-color: rgba(255,255 ,255, 0.3); display: block; content: ''; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }

.history-thumbs  .swiper-slide-thumb-active .yuan::after{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }

.historyBot::after{ width: 100%; height: 1px; position: absolute; left: 0; top: 20px; background: rgba(255, 255, 255, 0.25); z-index: 1; display: block; content: '';}

.history-thumbs  .swiper-slide-thumb-active .yuan i{ background-color: var(--blue);}



.history .prev,.history .next{ z-index: 20; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }

.history .prev{ left: -100px;}.history .next{ right: -100px;}





.honor{ background: url(../images/honorbg.jpg) no-repeat center center; background-size: cover;}

.honor  .next,.honor .prev{z-index: 20;position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);}

.honor .prev{ left: -100px;}

.honor  .next{ right: -100px;}

/* .honor  .next:hover,.history .prev:hover{ background-color: #00696c; color: #fff;} */

.swbutton.swiper-button-disabled{cursor: no-drop;}



.honor .swiper-slide{ background: url(../images/award1.png) no-repeat center top -8% #f8f9fb ; background-size: 40% auto; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; } 

.honor .swiper-slide{ width: 100%;}





.honorSwiper li{ display: none;}

.honorSwiper li.on{ display: block;}

.honorTab li{ height: 2.6em; border-radius: 1.5em; -webkit-border-radius: 1.5em; -moz-border-radius: 1.5em; -ms-border-radius: 1.5em; -o-border-radius: 1.5em; }

.honorTab li.on{ background-color: var(--blue); color: #fff;}



.probanimg{ height: 61%; bottom: 3%; right: 21%; position: absolute;}

.proLeft{ width: 32%;}

.proRight{ width: 68%;}



.proSub li{ border-radius: 0 40px 40px 0; -webkit-border-radius: 0 40px 40px 0; -moz-border-radius: 0 40px 40px 0; -ms-border-radius: 0 40px 40px 0; -o-border-radius: 0 40px 40px 0;}

.proSub li a{ height: 3.6em; }

.proSub li em{ border-radius:50% ; width: 12px; height: 12px; border: 2px solid #fff; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ; }

.proSub li:hover {box-shadow: 0 0 10px rgba(16, 51, 115, .2);}

.proSub li:hover a{ transform:translateX(-10px) ; -webkit-transform:translateX(-10px) ; -moz-transform:translateX(-10px) ; -ms-transform:translateX(-10px) ; -o-transform:translateX(-10px) ; }



.allmacth{ display: none;}

.allmacth a:hover{ transform:translateX(10px) ; -webkit-transform:translateX(10px) ; -moz-transform:translateX(10px) ; -ms-transform:translateX(10px) ; -o-transform:translateX(10px) ; }

.allmacth a.on{ color: var(--blue);}



.proSub .item.on .allmacth{  display: block; }





.object{ object-fit: cover;}

.prolist .button a::after{ width:0 ; height: 100%; background-color: var(--blue); content: ''; transition:all .36s ; position: absolute; left: 0; top: 0; display: block; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }

.prolist .button a:first-child{ color: #fff;}

.prolist .button a:first-child::after{ width: 100%;}



.prolist .button a:hover{ color: #fff;   }

.prolist .button a:hover::after{ width: 100%;}

.prolist .button:hover > a:not(:hover)::after{ width: 0; }

.prolist .button:hover > a:not(:hover){ color: #333; }

.prolist li:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)}

 

.neibanImg{ min-height: 250px; object-fit: cover;}



.proInfoBg{ background: url(../images/proinfoban.jpg) no-repeat center top #f8f9fb; background-size: 100% auto; padding-top: 100px;}

.proinfotext  .line{ height: 1px; background-color: #e5e5e5;}

.proinfotext  .line::before{ display: block; content: ''; background-color: var(--blue); position: absolute; left: 0; top: -1px; height: 3px; width: 50px;}

.proinfotext .button a{ border-color: var(--blue); height: 60px;}

.proinfoLine .title::after{ display: block; content: ''; background-color: var(--blue); position: absolute; left: 0; bottom: -1px; height: 3px; width: 100%;}



.cooperateNav a.on{background-color: var(--blue); color: #fff;}

.cooperateliist li .idxMore:hover{ transform: translateX(15px); -webkit-transform: translateX(15px); -moz-transform: translateX(15px); -ms-transform: translateX(15px); -o-transform: translateX(15px); }



.newslist li{ width: calc((100% - 80px)/3); margin-bottom: 40px; margin-right: 40px;}

.newslist li:nth-child(3n){ margin-right: 0;}

.newslist li:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)}

 

.newLeft{ width: 67.5%;}

.newsRight{ width: 32.5%;}

.rightItem .txt{ width: 73%;}

.rightItem .img{ width: 25%;}

.rightItem .img img{ width: 100%; height: 70px; object-fit: cover;}

.rightItem::after{ width: 0; height: 1px; position: absolute; left: 0; bottom: 0; display: block; content: ''; background-color: var(--blue); transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }

.rightItem:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)}

.rightItem:hover::after{ width: 100%;}.rightItem:hover .img img{ transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; } 



.contactStyle{ background: url(../images/contactstylebg.png) no-repeat bottom center #f8f9fb; background-size: 100% auto;}

.contactStyle::before{ width: 100%; height: 100%; display: block; content: ''; position: absolute; top: 0; left: 0; background: url(../images/contactstyletop.png) no-repeat center top; background-size: 100% auto; }



.contactStyle .right .f60{ border-bottom: 3px solid #fff;}

.contactStyleImg{ width: 114px; height: 114px; object-fit: cover; border: 2px solid #fff;}

.contactEwm .img{ border: 2px solid var(--blue);}

.contactEwm img{ width: 156px;}



.gbookItem{ width: 32%;}

.contactWap{ background: url(../images/contactwapbg.jpg) no-repeat center bottom; background-size: cover;}

.contactWap .img{ width: 63%;}

.contactWap .txt{ width: 30%;}

.newinfoZW{ height: 100px;}





.searchTop{ background-color: #f8faff;}

.searchTop form{ width: 700px;}

.searchTop form .text{ width: calc(100% - 70px); }

.searchTop form .submit{ width: 70px; height: 70px; background: url(../images/searchbig.png) no-repeat center center; background-size: 35% auto;}



.searchlist{   }

.searchlist li::after{ width: 0; height: 2px; position: absolute; left: 0; bottom: 0; background-color: var(--blue); display: block; content: ''; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }

.searchlist li .left{ width:70% ;}

.searchlist li .right{ width: 70px; height: 70px;}

.searchlist li:hover::after{ width: 100%;}

.searchlist li:hover .right{ background-color: var(--blue); color: #fff; transform: scale(0.95); -webkit-transform: scale(0.95); -moz-transform: scale(0.95); -ms-transform: scale(0.95); -o-transform: scale(0.95); }







.caselist li{ width: calc((100% - 50px) / 2); margin-right: 50px; margin-bottom: 50px;}

.caselist li:nth-child(2n){ margin-right: 0;}

/* .caselist li:hover .mask-white{ -webkit-transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0); transform:scale3d(2.2,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)}

.caselist li:hover .img img{ transform: scale(1.1);} */

.caselist li  .tit span{

  /*text-decoration: underline;

  */background-image: linear-gradient(currentColor 0, currentColor 0);

  background-image: linear-gradient(currentColor 0 0);

  background-position: 0 calc(100% - 1px);

  background-size: 0 1px;

  background-repeat: no-repeat;

  transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

  -webkit-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

  -moz-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

  -ms-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

  -o-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;

}

/* .caselist li:hover{ transform: translateY(-15px); -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); }

.caselist li:hover .tit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}

.caselist li:hover  .img{ box-shadow: 0 0  10px rgba(0, 0, 0, .1);} */



.caselist .logo-div{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 33;}

.caselist .logo-div img{filter: grayscale(100%) brightness(500%);}

.caselist .logo-topdiv{ position: absolute; top: 0; height: 0; bottom: 50%; background: var(--blue); right: 0; left: 0; transition: all 1s; opacity: 0.8;}

.caselist .logo-bottomdiv{ position: absolute;  height: 0; bottom: 0; background: var(--blue); right: 0; left: 0; transition: all 1s; opacity: 0.8;}

.caselist .logo-div img{ display: block;   top: 50%; left: 50%; transform: translate(-50%,-50%); position: absolute; z-index: 33; transition: all 0.6s; 

  opacity: 0; width:40% !important; height: auto !important;}

.caselist li:hover .logo-topdiv,.caselist li:hover .logo-bottomdiv{ height: 50%;}

.caselist li:hover .logo-div img{ opacity: 1; transition-delay: 0.4s;}



.caselist li:hover .img>img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }

.caselist li:hover { transform: translateY(-12px); box-shadow: 0 0 10px rgba(16, 51, 115, 0.2); -webkit-transform: translateY(-12px); -moz-transform: translateY(-12px); -ms-transform: translateY(-12px); -o-transform: translateY(-12px); }