@charset "utf-8";


#solutions{position: relative; margin: 0 auto;overflow: hidden; padding-top: 100px;}
#solutions>.introduce{position: absolute;z-index: 20; left: 0;top: 0; height: 100vh; background: #f2f8ff; display: flex; align-items: center;align-content: center;  }
#solutions>.introduce .bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;}
#solutions>.introduce .bg>img{width: 100%; height: 100%; object-fit: cover;}
#solutions>.introduce .content{position: relative;z-index: 12;}
#solutions>.introduce .content>.title{ display: block; width: 70%; text-align: center; margin: 0 auto;}
#solutions>.introduce .content>.title>h2{font-size: 8rem; font-weight: bold;display: initial; background: #E0E1E7 -webkit-linear-gradient(left, rgba(7, 88, 171, 1) 0%, rgba(110, 222, 100, 1) 62.39%) no-repeat 0 0; -webkit-text-fill-color: transparent; -webkit-background-clip: text; background-size: 0;}
#solutions>.introduce .content>.title>h2 span{ font-size: 8rem; }
#solutions>.introduce .content>.text{ width: 50%;margin: 0 auto; padding: 50px 0; text-align: center; display: block; font-size: 1.8rem; font-weight: 200; line-height: 2.4rem;  color: #999;}
#solutions>.introduce .tips{ position: absolute;z-index: 12; left: 50%;bottom: 10%; transform: translateX(-50%); display: block;-webkit-animation: updown 0.5s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate;animation: updown 0.5s cubic-bezier(0.56, 0.01, 0.46, 1) infinite alternate;}
#solutions>.introduce .tips>span{position: relative;display: inline-flex; align-content: center;align-items: center; justify-content: center; margin: 0 auto; width: 30px; }
#solutions>.introduce .tips>span>i{font-size: 3.6rem;display: inline-block; color:rgba(110, 222, 100, 1); }
#solutions>.introduce .tips>span::before { display: none; content: ""; width: 10vw;height: 1px;position: absolute;left: 136%; top: 50%; transform: translateY(-50%); background: linear-gradient(to left, rgba(7, 88, 171, 0) 0%, rgba(7, 88, 171, 1) 100%);}
#solutions>.introduce .tips::after { display: none; content: ""; width: 10vw; height: 1px; position: absolute; right: 136%; top: 50%; transform: translateY(-50%); background: linear-gradient(to right, rgba(7, 88, 171, 0) 0%, rgba(7, 88, 171, 1) 100%);}
#solutions>.path{background: #f6f6f6; padding-top: 20px;}
#solutions>.sector{ position: relative; margin: 0 auto; background: #f6f6f6; padding: 50px 0 100px 0;}
#solutions>.sector .lists{position: sticky; overflow: hidden; margin: 0 auto;}
#solutions>.sector .lists>ul{margin: 0 auto; }
#solutions>.sector .lists>ul>li{display: block; float: left;width: 31.33%; margin-right: 3%;margin-bottom: 3%;}
#solutions>.sector .lists>ul>li:nth-child(3n){ margin-right: 0;}
#solutions>.sector .lists>ul>li a{display: block; border-radius: 16px;overflow: hidden; background: #fff; transition: all .35s;}
#solutions>.sector .lists>ul>li a>.img{text-align: center;margin: 0 auto;overflow: hidden; background: #000;}
#solutions>.sector .lists>ul>li a>.img>img{width: 100%;height: auto; transition: all 1.2s;}
#solutions>.sector .lists>ul>li a>.box{display: flex; align-items: center;align-content: center; justify-content: space-between;padding:30px 40px;}
#solutions>.sector .lists>ul>li a>.box>.title{display: inline-block; flex: 1; font-size: 2.4rem; color: #333;  transition: all .35s;}
#solutions>.sector .lists>ul>li a>.box>.ico{width: 40px; display: inline-block; text-align: right;}
#solutions>.sector .lists>ul>li a>.box>.ico>img{width: 100%;height: auto;}
#solutions>.sector .lists>ul>li a:hover{box-shadow: 0 6px 16px rgba(0,0,0,.062);}
#solutions>.sector .lists>ul>li a:hover .box>.title{color: #0758ab;}
#solutions>.sector .lists>ul>li a:hover .img>img{ transform: scale(1.1);opacity: .5;}

@keyframes updown {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-6px);
    }
}




#solutions>.view .wrap{max-width: 1400px;}
#solutions>.view .overview{display: block; margin: 0 auto;}
#solutions>.view .overview>.layout{ margin:  0 auto; padding:80px 0;}
#solutions>.view .overview>.layout .img{width: 50%;text-align: right;}
#solutions>.view .overview>.layout .img>img{ width: 100%;height: auto; border-radius: 16px;}
#solutions>.view .overview>.layout .content{width: 42%; text-align: left;}
#solutions>.view .overview>.layout .content>.theme{ display: flex; align-content: center; align-items: center; font-size: 4.6rem; font-weight: bold; color: #0758ab;}
#solutions>.view .overview>.layout .content>.theme>i{display: inline-flex; align-items: center; align-content: center; width: 76px; height: 76px; padding: 8px; border: 1px solid #0758ab; border-radius: 100%; margin-right: 20px; }
#solutions>.view .overview>.layout .content>.theme>i>img{width: 100%;height: auto;}
#solutions>.view .overview>.layout .content>.theme>span{display: inline-block;}
#solutions>.view .overview>.layout .content>.intro{font-size: 1.6rem; line-height: 2.6rem; color: #666; box-sizing: border-box;padding: 30px 0;}

#solutions>.view .details .item{display: block; margin:  50px auto;}
#solutions>.view .details .item>.theme{ margin: 0 auto; text-align: center; font-size: 4.6rem; font-weight: bold; color: #333; border-bottom: 1px solid #ddd; padding: 50px 0;}
#solutions>.view .details .item>.content{ margin:  0 auto; padding:80px 0;}
#solutions>.view .details .item>.content img{ display: block; max-width: 1200px; width: 100%; height: auto; margin: 0 auto;}
#solutions>.view .details .item>.content>.text{  font-size: 1.6rem; line-height: 2.4rem; color: #666;}
#solutions>.view .details .item>.content>.text>p{margin-bottom: 10px;}

#solutions>.view .cases{display: block; margin: 50px auto;}
#solutions>.view .cases .theme{ margin: 0 auto; text-align: center; font-size: 4.6rem; font-weight: bold; color: #333; border-bottom: 1px solid #ddd; padding: 50px 0;}
#solutions>.view .cases .content{ margin:  0 auto; padding:80px 0;}
#solutions>.view .cases .content .swiper{margin: 0 auto;}
#solutions>.view .cases .content .swiper .swiper-slide{ background: #f7f7f7; border-radius: 16px;overflow: hidden;}
#solutions>.view .cases .content .swiper .swiper-slide>.img{width: 50%;}
#solutions>.view .cases .content .swiper .swiper-slide>.img>img{width: 100%;height: auto;object-fit: cover;}
#solutions>.view .cases .content .swiper .swiper-slide>.box{width: 42%; box-sizing: border-box;padding: 50px 80px;text-align: left;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.title{font-size: 3rem; line-height: 3.6rem; height: 120px; color: #333;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.info{ margin-top: 20px;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.info>.rows{ display: flex; align-items: center;align-content: center; justify-content: flex-start; margin-bottom: 10px;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.info>.rows>i{display: inline-block; font-size: 2rem; color: #666; margin-right: 10px;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.info>.rows>span{display: inline-block; font-size: 1.6rem; font-weight: 200; color: #999;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.more{position: relative; margin-top: 30px;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.more>a{position: relative; overflow: hidden; display: inline-flex; align-items: center; align-content: center; justify-content: center; height: 50px; padding: 0 40px; font-size: 1.4rem; color: #0758ab; border-radius: 50px; border: 1px solid #0758ab; margin: 15px auto; transition: all .35s;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.more>a>span{display: inline-block; margin-right: 10px;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.more>a>i{font-size: 2rem; transition: all .35s;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.more>a:hover{background: #0758ab; color: #fff;}
#solutions>.view .cases .content .swiper .swiper-slide>.box>.more>a:hover i{transform: translateX(6px);}
#solutions>.view .cases .content .swiper .swiper-pagination{position: relative; padding-top: 30px;}

#solutions>.view .products{display: block; margin: 0 auto; background: #f7f7f7;}
#solutions>.view .products .theme{ margin: 0 auto; text-align: center; font-size: 4.6rem; font-weight: bold; color: #333; border-bottom: 1px solid #ddd; padding: 50px 0;}
#solutions>.view .products .content{ margin:  0 auto; padding:80px 0;}
#solutions>.view .products .content .swiper{margin: 0 auto;}
#solutions>.view .products .content .swiper .swiper-slide{padding: 16px 0;}
#solutions>.view .products .content .swiper .swiper-slide>a{ display: block;overflow: hidden; background: #fff; box-sizing: border-box; border-radius: 16px; transition: all .35s;}
#solutions>.view .products .content .swiper .swiper-slide>a>.img{text-align: center;}
#solutions>.view .products .content .swiper .swiper-slide>a>.img>img{ display: block; width: 70%;height: auto; margin: 0 auto;}
#solutions>.view .products .content .swiper .swiper-slide>a>.box{ text-align: left; padding: 30px;}
#solutions>.view .products .content .swiper .swiper-slide>a>.box>.title{margin: 0 auto;}
#solutions>.view .products .content .swiper .swiper-slide>a>.box>.title>h3{display: block; font-size: 2rem; color: #333; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; transition: all .35s;}
#solutions>.view .products .content .swiper .swiper-slide>a>.box>.title>p{ margin: 10px auto 30px auto; height: 36px; font-size: 1.5rem; color: #999; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
#solutions>.view .products .content .swiper .swiper-slide>a>.box>.more{position: relative; overflow: hidden; display: block; text-align: center; font-size: 1.4rem; color: #0758ab; padding: 15px 0;  border-radius: 50px; border: 1px solid #0758ab; margin: 15px auto; transition: all .35s;}
#solutions>.view .products .content .swiper .swiper-slide>a>.box>.more:after{ position: absolute;z-index: 1; left: -180%; top: -6%; width:160%;height: 200%; background: #0758ab; border-radius: 100%; content: ''; transition: all 1s;}
#solutions>.view .products .content .swiper .swiper-slide>a>.box>.more>span{ position: relative;z-index: 12; display: inline-block; margin-right: 30px; transition: all .35s; }
#solutions>.view .products .content .swiper .swiper-slide>a>.box>.more>span:after{position: absolute;z-index: 12; top: 50%; margin-top: -10px; right: -30px;width: 20px; height: 20px; line-height: 20px; font-family: iconfont; font-size: 2rem; content: '\e6a9'; transform: rotate(-30deg); transition: all .2s;}
#solutions>.view .products .content .swiper .swiper-slide>a:hover{ box-shadow: 0 2px 16px rgba(0,0,0,.062);}
#solutions>.view .products .content .swiper .swiper-slide>a:hover .box>.more{ border-color: transparent;}
#solutions>.view .products .content .swiper .swiper-slide>a:hover .box>.more:after{ left: 0; transform: scale(3);}
#solutions>.view .products .content .swiper .swiper-slide>a:hover .box>.more>span{color: #fff;}
#solutions>.view .products .content .swiper .swiper-slide>a:hover .box>.more>span:after{ transform: rotate(0deg);}
#solutions>.view .products .content .swiper .swiper-slide>a:hover .box>.title>h3{color: #0758ab;}
#solutions>.view .products .content .swiper  .swiper-pagination-progressbar { position: relative; height: 2px!important; margin: 10px auto;}
#solutions>.view .products .content .swiper  .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #0758ab!important;}
#solutions>.view .products .content .swiper .control{display: flex; align-items: center;align-content: center;justify-content: flex-end; padding-top: 10px;}
#solutions>.view .products .content .swiper .control>.prev, #solutions>.view .products .content .swiper .control>.next{ cursor: pointer; margin-left: 10px; display: inline-flex; width: 46px;height: 46px; border: 1px solid #0758ab; color: #0758ab; border-radius: 100%; align-content: center;align-items: center;justify-content: center; transition: all .35s;}
#solutions>.view .products .content .swiper .control>.prev>i, #solutions>.view .products .content .swiper .control>.next>i{font-weight: bold;}
#solutions>.view .products .content .swiper .swiper-button-disabled{opacity: .3; background: none!important; color: #0758ab!important;}
#solutions>.view .products .content .swiper .control>.prev:hover, #solutions>.view .products .content .swiper .control>.next:hover{background: #0758ab; color: #fff;}






#solutions>.view2{margin: 0 auto; padding-bottom: 100px;}
#solutions>.view2 .navbar{position: relative; min-width: 210px;}
#solutions>.view2 .navbar>.nav{background: #ebf5ff; border-radius: 16px; box-sizing: border-box;padding: 20px;}
#solutions>.view2 .navbar>.nav>a{display: block; font-size: 1.8rem; padding: 15px 0;}
#solutions>.view2 .navbar>.nav>a.active{color: #0758ab;}
#solutions>.view2 .navbar>.consult{margin: 25px auto;}
#solutions>.view2 .navbar>.consult>a{ position: relative; overflow: hidden; display: flex; align-items: center; align-content: center; justify-content: center; background-image: linear-gradient(45deg, #0758ab, rgba(110, 222, 100, 1)); color: #fff; border-radius: 10px; padding: 10px 0; text-align: center;}
#solutions>.view2 .navbar>.consult>a:after{position: absolute;z-index: 1; right: -100%; top: -100%; width:100%;height: 240%; background: #0758ab;opacity: 0; border-radius: 100%; content: ''; transition: all .6s;}
#solutions>.view2 .navbar>.consult>a i{ position: relative; z-index: 12; display: inline-block; font-size: 3rem; margin-right: 6px;}
#solutions>.view2 .navbar>.consult>a span{position: relative;z-index: 12; display: inline-block; font-size: 1.6rem;}
#solutions>.view2 .navbar>.consult>a:hover:after{ right: 0;opacity: 1; transform: scale(3);}
#solutions>.view2 .navbar.on{position: fixed; top: 16%; left: 8%; }
#solutions>.view2 .container{ width: 76%; box-sizing: border-box; padding:50px 0 50px 120px; border-left: 1px solid #ddd;}
#solutions>.view2 .container>.title{font-size: 4.6rem; font-weight: bold;color: #333;position: relative; margin: 0 auto 80px auto;padding:5px 30px;}
#solutions>.view2 .container>.title:after{position: absolute;z-index: 2; left: 0; top: 0; width: 4px;height: 100%; background: #0758ab;content: '';}
#solutions>.view2 .container>.overview{display: block; margin: 0 auto;}
#solutions>.view2 .container>.overview>.title{font-size: 3rem; color: #333; border-bottom: 1px solid #eee; padding-bottom: 10px;}
#solutions>.view2 .container>.overview>.content{ margin:  0 auto; padding:80px 0;}
#solutions>.view2 .container>.overview>.content .img{width: 42%;text-align: right;}
#solutions>.view2 .container>.overview>.content .img>img{border-radius: 16px;}
#solutions>.view2 .container>.overview>.content .intro{ width: 50%; font-size: 1.6rem; line-height: 3rem; color: #666; box-sizing: border-box;padding: 30px 0;}
#solutions>.view2 .container>.tags>.item{display: block; margin: 0 auto 50px auto;}
#solutions>.view2 .container>.tags>.item>.title{font-size: 3rem; color: #333; border-bottom: 1px solid #eee; padding-bottom: 10px;}
#solutions>.view2 .container>.tags>.item>.content{ margin:  0 auto; padding:80px 0;}
#solutions>.view2 .products{display: block; margin: 0 auto 50px auto;}
#solutions>.view2 .products>.title{font-size: 3rem; color: #333; border-bottom: 1px solid #eee; padding-bottom: 10px;}
#solutions>.view2 .products>.content{ margin:  0 auto; padding-top:80px;}
#solutions>.view2 .products>.content .swiper{margin: 0 auto;}
#solutions>.view2 .products>.content .swiper .swiper-slide{padding: 16px 0;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a{ display: block;overflow: hidden; background: #fff; border: 1px solid #eee; box-sizing: border-box; border-radius: 16px; transition: all .35s;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.img>img{ width: 100%;height: auto;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box{ text-align: left; padding: 30px;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box>.title{margin: 0 auto;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box>.title>h3{display: block; font-size: 2rem; color: #333; transition: all .35s;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box>.title>p{ margin: 10px auto 30px auto; height: 36px; font-size: 1.5rem; color: #999; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box>.more{position: relative; overflow: hidden; display: block; text-align: center; font-size: 1.4rem; color: #0758ab; padding: 15px 0;  border-radius: 50px; border: 1px solid #0758ab; margin: 15px auto; transition: all .35s;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box>.more:after{ position: absolute;z-index: 1; left: -180%; top: -6%; width:160%;height: 200%; background: #0758ab; border-radius: 100%; content: ''; transition: all 1s;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box>.more>span{ position: relative;z-index: 12; display: inline-block; margin-right: 30px; transition: all .35s; }
#solutions>.view2 .products>.content .swiper .swiper-slide>a>.box>.more>span:after{position: absolute;z-index: 12; top: 50%; margin-top: -10px; right: -30px;width: 20px; height: 20px; line-height: 20px; font-family: iconfont; font-size: 2rem; content: '\e6a9'; transform: rotate(-30deg); transition: all .2s;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a:hover{ box-shadow: 0 2px 16px rgba(0,0,0,.062);}
#solutions>.view2 .products>.content .swiper .swiper-slide>a:hover .box>.more{ border-color: transparent;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a:hover .box>.more:after{ left: 0; transform: scale(3);}
#solutions>.view2 .products>.content .swiper .swiper-slide>a:hover .box>.more>span{color: #fff;}
#solutions>.view2 .products>.content .swiper .swiper-slide>a:hover .box>.more>span:after{ transform: rotate(0deg);}
#solutions>.view2 .products>.content .swiper .swiper-slide>a:hover .box>.title>h3{color: #0758ab;}
#solutions>.view2 .products>.content .swiper  .swiper-pagination-progressbar { position: relative; height: 2px!important; margin: 10px auto;}
#solutions>.view2 .products>.content .swiper  .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #0758ab!important;}
#solutions>.view2 .products>.content .swiper .control{display: flex; align-items: center;align-content: center;justify-content: flex-end; padding-top: 10px;}
#solutions>.view2 .products>.content .swiper .control>.prev, #solutions>.view2 .products>.content .swiper .control>.next{ cursor: pointer; margin-left: 10px; display: inline-flex; width: 40px;height: 40px; border: 1px solid #666; color: #666; border-radius: 100%; align-content: center;align-items: center;justify-content: center; transition: all .35s;}
#solutions>.view2 .products>.content .swiper .control>.prev>i, #solutions>.view2 .products>.content .swiper .control>.next>i{font-weight: bold;}
#solutions>.view2 .products>.content .swiper .swiper-button-disabled{opacity: .3; color: #666!important; border-color: #666!important;}
#solutions>.view2 .products>.content .swiper .control>.prev:hover, #solutions>.view2 .products>.content .swiper .control>.next:hover{border-color: #0758ab; color: #0758ab;}




@media only screen and (max-width: 1460px){

    #solutions>.introduce .content>.title>h2{font-size: 7rem;}
    #solutions>.introduce .content>.title>h2 span{ font-size: 7rem; }
    #solutions>.introduce .content>.text{ width: 60%;font-size: 1.7rem;line-height: 2.2rem;}

    #solutions>.sector .lists>ul>li a>.box>.title{ font-size: 2rem;}


    #solutions>.view .overview>.layout .content>.theme{font-size: 4rem;}
    #solutions>.view .overview>.layout .content>.theme>i{width: 70px; height: 70px; }

    #solutions>.view .details .item>.theme{ font-size: 4rem;}

    #solutions>.view .cases .theme{ font-size: 4rem;}
    #solutions>.view .cases .content .swiper .swiper-slide>.img{width: 55%;}

    #solutions>.view .products .theme{ font-size: 4rem;}







}


@media only screen and (max-width: 1360px){

    #solutions>.introduce .content>.text{ font-size: 1.6rem;line-height: 2rem;}


    #solutions>.view .cases .content .swiper .swiper-slide>.img{position: absolute;z-index: 12; right: 0; top: 0; height: 100%; width: 50%;}
    #solutions>.view .cases .content .swiper .swiper-slide>.img>img{height: 100%; width: 100%;}
    #solutions>.view .cases .content .swiper .swiper-slide>.box{width: 50%; }
    #solutions>.view .cases .content .swiper .swiper-slide>.box>.title{font-size: 2.8rem; line-height: 3rem;}


}


@media only screen and (max-width: 1280px){

    #solutions>.introduce .content>.title>h2{font-size: 6rem;}
    #solutions>.introduce .content>.title>h2 span{ font-size: 6rem; }

    #solutions>.sector .lists>ul>li{width: 48.5%; margin-right: 0;}
    #solutions>.sector .lists>ul>li:nth-child(even){ float: right;}



    #solutions>.view .overview>.layout .content>.intro{font-size: 1.4rem; line-height: 2.4rem;}

}

@media only screen and (max-width: 1080px){

    #solutions>.introduce .content>.text{ width: 70%;}

    #solutions>.view .overview>.layout .content>.theme{font-size: 3rem;}
    #solutions>.view .overview>.layout .content>.theme>i{width: 60px; height: 60px; }
    #solutions>.view .details .item>.theme{ font-size: 3rem;}
    #solutions>.view .cases .theme{ font-size: 3rem;}
    #solutions>.view .products .theme{ font-size: 3rem;}

}

@media only screen and (max-width: 960px){

    #solutions>.view .overview>.layout{padding: 0;}
    #solutions>.view .overview>.layout .img{width: 100%; float: none; padding: 0;}
    #solutions>.view .overview>.layout .content{width: 100%; float: none;}

    #solutions>.view .cases .content .swiper .swiper-slide>.box { padding: 50px; }
    #solutions>.view .cases .content .swiper .swiper-slide>.box>.title { font-size: 2.4rem; }

    #solutions>.view .cases .content .swiper .swiper-slide>.box>.more>a{height: 42px; padding: 0 30px; font-size: 1.2rem;}
    #solutions>.view .cases .content .swiper .swiper-slide>.box>.more>a>i{font-size: 1.8rem;}



    #solutions>.view .products .content .swiper .swiper-slide>a>.box>.more{font-size: 1.2rem;}



}




@media only screen and (max-width: 860px){

    #solutions>.introduce .content>.title>h2{font-size: 5rem;}
    #solutions>.introduce .content>.title>h2 span{ font-size: 5rem; }
    #solutions>.introduce .content>.text { font-size: 1.4rem; line-height: 2rem;}

    #solutions>.sector .lists>ul>li a>.box { padding: 20px 30px;}
    #solutions>.sector .lists>ul>li a>.box>.title{ font-size: 1.6rem;}


    #solutions>.view .cases .content .swiper .swiper-slide>.img{width: 100%; float: none; position: relative;}
    #solutions>.view .cases .content .swiper .swiper-slide>.box{width: 100%; float: none;}

    #solutions>.view .details .item>.content>.text {  font-size: 1.4rem; line-height: 2rem;}


}
@media only screen and (max-width: 780px){


    #solutions>.view .details .item>.theme{padding: 30px 0;}
    #solutions>.view .cases .theme{ padding: 30px 0;}
    #solutions>.view .products .theme{ padding: 30px 0;}


    #solutions>.introduce .content>.title>h2{font-size: 4.6rem;}
    #solutions>.introduce .content>.title>h2 span{ font-size: 4.6rem; }

    #solutions>.view .cases .content .swiper .swiper-slide>.box>.title { font-size: 2rem; }



}

@media only screen and (max-width: 640px){

    #solutions>.introduce .content>.title>h2{font-size: 4rem;}
    #solutions>.introduce .content>.title>h2 span{ font-size: 4rem; }

    #solutions>.sector .lists>ul>li{ float: none;width: 100%; margin-bottom: 30px;}
    #solutions>.sector .lists>ul>li:nth-child(even){ float: none;}


    #solutions>.view .overview>.layout .content>.theme{font-size: 2.4rem;}
    #solutions>.view .details .item>.theme{ font-size: 2.4rem;}
    #solutions>.view .cases .theme{ font-size: 2.4rem;}
    #solutions>.view .cases .content .swiper .swiper-slide>.box>.title { font-size: 1.8rem;  height: 80px;}
    #solutions>.view .cases .content .swiper .swiper-slide>.box>.info>.rows>span {  font-size: 1.4rem; }
    #solutions>.view .products{ padding-top: 30px;}
    #solutions>.view .products .theme{ font-size: 2.4rem;}
    #solutions>.view .products .content .swiper .swiper-slide>a>.img>img{  width: 86%;}
    #solutions>.view .products .content .swiper .control>.prev, #solutions>.view .products .content .swiper .control>.next{ width: 40px;height: 40px; }


}
@media only screen and (max-width: 520px){

    #solutions { padding-top: 50px; }

    #solutions>.introduce{ height: 100vh;  }
    #solutions>.introduce .content>.title{width: 100%;}
    #solutions>.introduce .content>.title>h2{font-size: 3rem;}
    #solutions>.introduce .content>.title>h2 span{ font-size: 3rem; }
    #solutions>.introduce .content>.text { font-size: 1.2rem; line-height: 1.6rem;}

    #solutions>.view .details .item>.content { padding: 30px 0; }


    #solutions>.view .overview>.layout .content>.theme{font-size: 2rem;}
    #solutions>.view .details .item>.theme{ font-size: 2rem;}
    #solutions>.view .cases .theme{ font-size: 2rem;}
    #solutions>.view .cases .content .swiper .swiper-slide>.box { padding: 40px;}
    #solutions>.view .cases .content .swiper .swiper-slide>.box>.title { font-size: 1.6rem;  line-height: 2rem; height: 70px;}
    #solutions>.view .products .theme{ font-size: 2rem;}






}