.pn-banner{margin-bottom: 0;}
.pn-banner:before,.pn-banner:after{filter: inherit}
.pn-banner .pn-img{background-image: url('../images/cloud-min-background.png');}
/**/
.pn-service{background-color: #e8f6f4;padding: 60px 0 30px 0;margin-bottom: 60px;}
.pn-service .pn-wrapper-scroll::-webkit-scrollbar { height: 3px;border-radius: 6px; }
.pn-service .pn-wrapper-scroll::-webkit-scrollbar-track {background-color: #fff;border-radius: 6px}
.pn-service .pn-wrapper-scroll::-webkit-scrollbar-thumb {background-color: #888;border-radius: 6px}
.pn-service .pn-wrapper-scroll.active {overflow-x: auto;-webkit-overflow-scrolling: touch;scroll-snap-type: x mandatory;touch-action: pan-x}
.pn-service-list{margin-bottom: 40px;padding: 0 20px;}
.pn-service-list ul{list-style: none;padding-left: 0;display: flex;flex-wrap: nowrap;align-items: center;margin-bottom: 0;}
.pn-service-list ul li{min-width: 20%;width: 20%;display: flex; justify-content: center;}
.pn-service-list ul li:nth-child(odd) .pn-item{transform: translateY(-25%);}
.pn-service-list ul li:nth-child(even) .pn-item{transform: translateY(25%);}
.pn-service-list ul li .pn-item{transition: .3s;clip-path: polygon( 25% 0%, 75% 0%,100% 50%,75% 100%,25% 100%,0% 50% );width: calc(100% + 40px);text-align: center;aspect-ratio: 8 / 7;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;cursor: pointer;background-color: #fff;margin:25% -20px}
.pn-service-list ul li .pn-item > div{padding: 30px 60px;}
.pn-service-list ul li .pn-item:hover,.pn-service-list ul li .pn-item.active{box-shadow: 0 9px 15px rgba(82, 175, 159,.3);background-color: #95d5ca}
.pn-service-list ul li .pn-item:hover span,.pn-service-list ul li .pn-item.active span{background-color: #fff}
.pn-service-list ul li .pn-item span{display: flex;width: 100px;height: 100px;text-align: center;margin: 0 auto 20px auto;background-color: #95d5ca;border-radius: 100px;align-items: center;justify-content: center;padding: 10px;}
.pn-service-list ul li .pn-item span img{filter: brightness(0) invert(1);-webkit-filter: brightness(0) invert(1);}
.pn-service-list ul li .pn-item:hover span img,.pn-service-list ul li .pn-item.active span img{filter: inherit;-webkit-filter: inherit;}
.pn-service-list ul li .pn-item p{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;text-transform: uppercase;font-size: 18px;line-height: 26px;font-weight: 600;margin-bottom: 0}

/**/
.pn-detail-service .pn-item{margin-bottom: 60px;transition: .3s;}
.pn-detail-service .pn-item .row{display: flex;flex-wrap: wrap}
.pn-detail-service .pn-item .row:before,.pn-detail-service .pn-item .row:after{display: none}
.pn-detail-service .pn-item:nth-child(even) .row{flex-direction: row-reverse;}
.pn-detail-service .pn-item{padding: 30px;border-radius: 20px;box-shadow: 0 0 15px rgba(82, 175, 159, .3);}
.pn-detail-service .pn-item .pn-image{border-radius: 10px;margin-bottom: 0;}
.pn-detail-service .pn-item .pn-name{text-transform: uppercase;font-size: 24px;line-height: 34px;font-weight: 800;margin-bottom: 15px;margin-top: 0;}
.pn-detail-service .pn-item .pn-wrapper{margin-bottom: 0;aspect-ratio: 1 / .45;}
.pn-detail-service .pn-item .pn-wrapper + p{margin-bottom: 0;}
.pn-detail-service .pn-item .pn-wrapper + p span{display: inline-block;border-bottom: 1px solid #2f2f2f;cursor: pointer}
.pn-detail-service .pn-item .pn-wrapper + p span:hover{color: #ee84a0;border-bottom-color: #ee84a0;}
.pn-wrapper-pagination{margin-bottom: 60px;}


@media only screen and (max-width: 1199px){
    /* .pn-service-list ul li{min-width: 25%;width: 25%;} */
    .pn-service-list ul li .pn-item p{font-size: 14px;line-height: 22px;}
}
@media only screen and (min-width: 992px){
    .pn-detail-service .pn-item .pn-wrapper + p{display: none;}
    .pn-detail-service .pn-item:hover{transform: scale(1.05);}
}
@media only screen and (max-width: 991px){
    .pn-service-list ul{margin: 0 -10px;align-items: inherit;flex-wrap: wrap;justify-content: center;}
    .pn-service-list ul li{margin-bottom: 20px;padding: 0 10px;width: calc(100% / 3);min-width: calc(100% / 3);}
    .pn-service-list ul li .pn-item{clip-path: none;background-color: #fff;border-radius: 20px;height: 100%;aspect-ratio: inherit;margin: 0 !important;padding: 15px;}
    .pn-service-list ul li .pn-item span{width: 80px;height: 80px;}
    .pn-service-list ul li .pn-item > div{padding: 0}
    .pn-service-list ul li .pn-item p{padding: 0;}
    .pn-service-list ul li:nth-child(odd) .pn-item,.pn-service-list ul li:nth-child(even) .pn-item{transform: inherit;}
    .pn-service-list{margin-bottom: 0;padding: 0;}
    /**/
    .pn-detail-service .pn-item{padding: 20px;margin-bottom: 30px;}
    .pn-detail-service .pn-item .pn-image{position: sticky;top: 150px;}
    .pn-detail-service .pn-item .pn-wrapper{padding-right: 0;aspect-ratio: initial;}
    .pn-detail-service .pn-item .pn-wrapper + p{margin: 20px 0 0 0;}
    .pn-detail-service .pn-item .pn-wrapper + p span{color: #ee84a0;border-bottom-color: #ee84a0;}
}
@media only screen and (max-width: 767px){
    .pn-service-list ul li .pn-item{border-radius: 10px;}
    /**/
    .pn-detail-service .pn-item .row{display: block;}
    .pn-detail-service .pn-item{padding: 0;box-shadow: none;margin-bottom: 60px;}
    .pn-detail-service .pn-item .pn-image{margin-bottom: 15px;}
}
@media only screen and (max-width: 680px){
    .pn-service-list ul li{width: 50%;}
}
@media only screen and (max-width: 570px){
    .pn-service-list ul li .pn-item p{font-size: 16px;line-height: 24px;}
    .pn-detail-service .pn-item .pn-name{font-size: 20px;line-height: 30px;margin-bottom: 10px;}
}
@media only screen and (max-width: 480px){
    .pn-service-list ul li .pn-item p{font-size: 14px;line-height: 22px;}
}
@media only screen and (max-width: 370px){
    .pn-service-list ul{display: block;}
    .pn-service-list ul li{width: 100%;min-width: inherit;}
    .pn-detail-service .pn-item .pn-name{font-size: 16px;line-height: 24px;}
}