/*解决方案*/
.solution-box{z-index: 1;position: relative;height: 820px;max-height:820px;background-position: center;background-size: cover;background-repeat: no-repeat;font-size: 0;text-align: center;color: #fff;overflow: hidden;transition: 1s ease-in-out;}
.solution-box:before{content: "";z-index: -1;position: absolute;left: 0;right: 0;top: 0;bottom: 0;background-color: rgba(0,0,0,.1);transition: 0;}
.solution-box:after{content: "";z-index: -1;position: absolute;left: 0;right: 0;top: 0;bottom: 0;transition: 1s ease-in-out;}
.solution-box.bg-blur:after{backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);}
.solution-box > .item{position: relative;display: inline-block;vertical-align: top;width: 20%;height: 100%;border:0px;border-left: 1px solid rgba(255,255,255,.3);font-size: 14px;}
.solution-box > .item:first-child{border-left: 0;}
.solution-box > .item:before{content: "";position: absolute;left: -1px;top: -100px;width: 1px;height: 100px;background-image: linear-gradient(180deg,transparent,#fff);animation: lineMove 2s ease-in-out infinite;}
@keyframes lineMove{
	to{top: 100%;}
}
.solution-box > .item:nth-child(1):before{animation-delay: 0s;}
.solution-box > .item:nth-child(2):before{animation-delay: 0.2s;}
.solution-box > .item:nth-child(3):before{animation-delay: 0.4s;}
.solution-box > .item:nth-child(4):before{animation-delay: 0.6s;}
.solution-box > .item:nth-child(5):before{animation-delay: 0.8s;}
.solution-box > .item:nth-child(6):before{animation-delay: 1.0s;}
.solution-box > .item:after{content: "";position: absolute;left: -1px;top: 0;width: calc(100% + 1px);height: calc(100% - 280px);background-color: rgba(0,0,0,.4);transform: scaleY(0);transform-origin: top;transition: 0.5s;}
.solution-box > .item:nth-child(1):after{height: 100%;}
.solution-box > .item:nth-child(6):after{height: 100%;}
.solution-box > .item .title{z-index: 1;position: absolute;left: 0;right: 0;top: 50%;transform: translateY(-50%);color: #fff;}
.solution-box > .item .title .icon{display: inline-block;width: 88px;height: 88px;}
.solution-box > .item .title .name{padding: 0 1em;margin-top: 30px;font-size: 30px;user-select: none;}
.solution-box > .item.bg:after{transform: scaleY(1);}
.solution-box > .content{position: absolute;left: 16.66%;top: 100%;width: 66.66%;font-size: 14px;}
.solution-box > .content > .item{border:0px;position: absolute;left: 0;top: 0;width: 100%;background-color: rgba(0,0,0,.4);transition: 0.5s;}
.solution-box > .content > .item.show{transform: translateY(-100%);}
.solution-box .cont-list{overflow: hidden;}
.solution-box .cont-list li{padding: 40px;}
.solution-box .cont-list li a{display: block;}
.solution-box .cont-list li .pic{float: left;width: 23.3%;height: 200px;overflow: hidden;transition: 0.5s;transition-delay: 0.5s;clip-path: polygon(100% 0,100% 0,100% 100%,100% 100%);-webkit-clip-path: polygon(100% 0,100% 0,100% 100%,100% 100%);}
.solution-box .cont-list li .pic em{display: block;height: 100%;background-position: center;background-size: cover;background-repeat: no-repeat;transition: 0.5s;}
.solution-box .cont-list li .info{position: relative;margin-left: 23.3%;height: 200px;transition: 0.5s;transition-delay: 0.5s;clip-path: polygon(0 0,0 0,0 100%,0 100%);-webkit-clip-path: polygon(0 0,0 0,0 100%,0 100%);}
.solution-box .cont-list li .info .name{position: absolute;left: 0;right: 0;top: 50%;width: 22%;transform: translateY(-50%);padding: 0 1em;font-size: 20px;text-align: left;color: #fff;}
.solution-box .cont-list li .info .txt{height: 120px;margin-left: 22%;text-align: justify;font-size: 16px;line-height: 40px;color: #fff;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
.solution-box .cont-list li .info .more{z-index: 1;position: absolute;right: 0;bottom: 0;padding: 0 4em 0 2em;border: 1px solid #fff;font-size: 16px;line-height: 48px;color: #fff;overflow: hidden;}
.solution-box .cont-list li .info .more:before{content: "";position: absolute;right: 2.5em;top: 50%;width: 10px;height: 10px;border-top: 1px solid #fff;border-right: 1px solid #fff;transform: rotate(45deg) translate(0,-70%);}
.solution-box .cont-list li .info .more:after{content: "";z-index: -1;position: absolute;left: -10%;top: 100%;width: 100px;height: 100px;background-color: #009adc;border-radius: 50%;transform: scale(0);transition: 1s;}
.solution-box .cont-list li .info .more:hover:after{transform: scale(3.5);}
.solution-box .cont-list li:hover .pic em{transform: scale(1.05);}
.solution-box > .content > .item.show .cont-list li .pic{clip-path: polygon(0 0,100% 0,100% 100%,0 100%);-webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
.solution-box > .content > .item.show .cont-list li .info{clip-path: polygon(0 0,100% 0,100% 100%,0 100%);-webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
.solution-box .cont-list.style2 li{float: left;width: 25%;padding: 40px 20px;}
.solution-box .cont-list.style2 li .pic{float: none;width: 100%;height: 160px;}
.solution-box .cont-list.style2 li .info{margin-left: 0;height: 40px;padding-top: 10px;}
.solution-box .cont-list.style2 li .info .name{position: static;width: 100%;text-align: center;transform: translateY(0);}

/*内容从左至右剪裁显示动效*/
.showingLTR{animation: clipLTR 0.8s ease-in-out;-webkit-animation: clipLTR 0.8s ease-in-out;}
@keyframes clipLTR{
	0%{clip-path: polygon(0 0,0 0,0 100%,0 100%);}
	100%{clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
}
@-webkit-keyframes clipLTR{
	0%{-webkit-clip-path: polygon(0 0,0 0,0 100%,0 100%);}
	100%{-webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
}
/*内容从右至左剪裁显示动效*/
.showingRTL{animation: clipRTL 0.8s ease-in-out;-webkit-animation: clipRTL 0.8s ease-in-out;}
@keyframes clipRTL{
	0%{clip-path: polygon(100% 0,100% 0,100% 100%,100% 100%);}
	100%{clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
}
@-webkit-keyframes clipRTL{
	0%{-webkit-clip-path: polygon(100% 0,100% 0,100% 100%,100% 100%);}
	100%{-webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
}
/*内容先从上至下剪裁1px，再从左至右剪裁显示动效*/
.showingTTBLTR{animation: clipTTBLTR 1.2s ease-in-out;-webkit-animation: clipTTBLTR 1.2s ease-in-out;}
@keyframes clipTTBLTR{
	0%{clip-path: polygon(0 0,1px 0,1px 0,0 0);}
	50%{clip-path: polygon(0 0,1px 0,1px 100%,0 100%);}
	100%{clip-path: polygon(0 0,100% 0,100% 100%,0 100%);}
}

/*解决方案(手机端)*/
.solution-box-phone{display: none;position: relative;padding: 10px 0 20px;overflow: hidden;}
.solution-box-phone .swiper-slide{z-index: 1;position: relative;padding-top: 60%;background-position: center;background-size: cover;background-repeat: no-repeat;}
.solution-box-phone .swiper-slide:after{content: "";z-index: -1;position: absolute;left: 0;right: 0;top: 0;bottom: 0;background-color: rgba(0,0,0,.2);}
.solution-box-phone .swiper-slide .title{position: absolute;left: 0;top: 50%;width: 100%;text-align: center;color: #fff;transform: translateY(-50%);}
.solution-box-phone .swiper-slide .title .icon{display: inline-block;width: 80px;height: 80px;}
.solution-box-phone .swiper-slide .title .name{padding: 0 1em;margin-top: 15px;font-size: 22px;font-weight: bold;}
.solution-box-phone .swiper-pagination{z-index: 1;bottom: 0;font-size: 0;}
.solution-box-phone .swiper-pagination-bullet-active{background-color: #009adc;}
.solution-box-phone .btn{display: none;z-index: 1;position: absolute;top: 50%;width: 20px;height: 20px;margin-top: -15px;background: url(../images/newindex/icons_arrowLR_30_white.png) no-repeat;background-size: 40px auto;cursor: pointer;}
.solution-box-phone .prev-btn{left: 5px;background-position: 0 0;}
.solution-box-phone .next-btn{right: 5px;background-position: -20px 0;}
@media screen and (max-width: 768px) {
  #w_grid-1567149865008 {
    width: 100%;
    max-width: none;
    min-width: 0px;
    height: auto;
    max-height: none;
    min-height: 10px;
    margin-top: 50px;

}
#w_fimg-1601975265978 {
    width: 100%;
    max-width: 86px;
    min-width: 0px;
    height: auto;
    max-height: none;
    min-height: 20px;
    margin-top: 10%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}
  #w_fimg-1601975821859 {
    width: 100%;
    max-width: 195px;
    min-width: 0px;
    height: auto;
    max-height: none;
    min-height: 20px;
    margin-top: 10%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}
  
  
  #content_box-1578053581113-0{width: 20%;   float: left;}
    #content_box-1578053581113-1{width: 80%;   float: left;}
  #content_box-1576314363992-0, 
  #content_box-1576314363992-1,
  #content_box-1576314363992-2, 
  #content_box-1576314363992-3 
  
  {width: 50%;   float: left;
    clear: none!important;
    display: inline-block;}
  .btn-primary {
    color: #fff;width: 100%;
    background-color:#016864;
    border-color:#016864;
}#w_common_text-1567149865313 p span{
        font-size: 25px!important;
}

  #c_portalResNews_category-15762366752784393 {
    width: auto;
    max-width: 100%;
    min-width: 0px;
    height: auto;
    max-height: none;
    min-height: 49px;
    margin-top: 22px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}
  #w_grid-1578300595866{margin-top:55px;}
  #w_common_text-1578301813016 {
    width: 100%;
    max-width: none;
    min-width: 0px;
    height: auto;
    max-height: none;
    min-height: 0px;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}#w_common_text-1578554429929 p,
#w_common_text-1578554429141 p,
#w_common_text-1578554427933 p,
#w_common_text-1578554313622 p,
#w_common_text-1578554429926 h2,
  #w_common_text-1578554427930 h2,
#w_common_text-1578554429137 h2,
#w_common_text-1578554313622 h2,
#w_common_text-1578554371428 h2{    text-align: center;}
  #w_grid-1572488847140,#w_grid-1593857848327,#w_grid-1592803564863,
 #w_grid-1572489343351,#w_grid-1590223390278,#w_grid-1576237622504,
  #w_grid-1572488440757,#w_grid-1572489781176,
  #w_grid-1572487895503,#w_grid-1572488115554,#w_grid-1572488597090,
  #w_grid-1572489925847,#w_grid-1576237565863,
  #w_grid-1572487192651 {
    width: 100%;
    max-width: none;
    min-width: 0px;
    height: auto;
    max-height: none;
    min-height: 20px;
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}#c_portalResProduct_category-15785531691271745,#c_portalResIntro_category-1572489781226,
  #c_portalResIntro_category-1576237565913,#c_portalResIntro_category-1572488115604,
  #c_portalResIntro_category-15724870964176640 {
    width: auto;
    max-width: none;
    min-width: 0px;
    height: auto;
    max-height: none;
    min-height: 45px;
    margin-top: 22px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}
}
