.pn-program-top{margin-bottom: 30px}
.pn-program-top .row{display: flex;justify-content: center;flex-wrap: wrap}
.pn-program-top .row [class*='col-']{margin-bottom: 30px;justify-content: center}
.pn-program-top .pn-item{background-color: #fff;border-radius: 20px;box-shadow: 0 5px 25px rgba(0,0,0,.1);margin-bottom: 0;height: 100%;text-align: center;padding: 30px 20px 20px 20px}
.pn-program-top .pn-item div{margin-bottom: 20px}
.pn-program-top .pn-item p{margin-bottom: 0}
.pn-program-top .pn-item span{display: inline-block;width: 70px;height: 70px;border-radius: 5px;background-color: var(--background-button)}
.pn-program-top .pn-item span img{filter: brightness(0) invert(1); -webkit-filter: brightness(0) invert(1);width: auto;height: auto}
/**/
.pn-program-bot .pn-title{margin-bottom: 30px}
.pn-program-bot{margin-bottom: 80px;background-color: #eff7ff;padding-top: 50px}
.pn-program-bot .pn-content{position: relative;padding: 170px 0 20px 0}
.pn-program-bot .pn-image-center{position: absolute;width: calc(calc(100% / 3) + 105px);left: 50%;transform: translateX(-50%);bottom: 0;border: 60px solid #d9e9fd;border-bottom: 0;height: 100%;display: flex;align-items: center;justify-content: center;margin-bottom: 0;overflow: hidden}
.pn-program-bot .pn-image img{width: auto;height: auto}
.pn-program-bot .pn-image-center img{width: 100%;object-fit: cover;min-height: 100%;height: auto}
.pn-program-bot .row [class*='col-']{margin-bottom: 30px}
.pn-program-bot .row [class*='col-']:nth-child(2n + 1){clear: both}
.pn-program-bot .pn-item{padding: 25px 20px;border-radius: 20px;background-color: #fff;box-shadow: 0 5px 25px rgba(0,0,0,.1);margin-bottom: 0;font-size: 1em;line-height: calc(1em + 10px);height: 100%}
.pn-program-bot .pn-item:hover{cursor: pointer}
.pn-program-bot .pn-item.active{background-color: var(--color-global);color: var(--color-text-global)}
.pn-program-bot .pn-item > div strong{display: block;text-transform: uppercase;margin-bottom: 5px;color: var(--color-global);font-size: 18px;line-height: 25px}
.pn-program-bot .pn-item.active > div strong{color: var(--color-text-global)}
.pn-program-bot .pn-item > strong + p{margin-bottom: 0}
.pn-program-bot .pn-item > div > p{margin-bottom: 0}
@media only screen and (min-width: 992px){
    .pn-program-bot .pn-item .pn-image{display: none}
    .pn-program-bot .row [class*='col-']:nth-child(odd){float: left;margin-right: calc(100% / 3/2)}
    .pn-program-bot .row [class*='col-']:nth-child(even){right: left;margin-left: calc(100% / 3/2)}
}
@media only screen and (max-width: 991px){
    .pn-program-top{margin-bottom: 0}
    .pn-program-bot .row{display: flex;flex-wrap: wrap}
    .pn-program-bot .row:before, .pn-program-bot .row:after{display: none}
    .pn-program-bot{margin-bottom: 0;padding-top: 30px}
    .pn-program-bot .pn-content{padding: 0}
    .pn-program-bot .pn-item .pn-image{border-radius: 20px 20px 0 0;margin: -25px -20px 20px -20px}
    .pn-program-bot .pn-image-center{display: none}
    .pn-program-bot .pn-image img{width: 100%;}
}
@media only screen and (min-width: 571px) and (max-width: 767px){
    .pn-program-bot .row [class*='col-']:nth-child(even) .pn-item{flex-direction: row-reverse;}
    .pn-program-bot .row [class*='col-']:nth-child(2n + 1){clear: initial;}
    .pn-program-bot .pn-item{display: flex;align-items: center;}
    .pn-program-bot .pn-item .pn-image{margin: 0;width: 45%;min-width: 45%;border-radius: 10px;position: sticky;top: 0;}
    .pn-program-bot .pn-item > div{width: 55%;min-width: 55%;padding-left: 20px;position: sticky;top: 100px}
    .pn-program-bot .row [class*='col-']:nth-child(even) .pn-item > div{padding-left: 0;padding-right: 20px;top: 100px}
}
@media only screen and (max-width: 570px){
    .pn-program-bot .pn-item{display: block;padding: 0;}
    .pn-program-bot .pn-item .pn-image{margin: 0}
    .pn-program-bot .pn-item .pn-image img{object-fit: fill;width: 100%;}
    .pn-program-bot .pn-item > div{padding: 15px;}
    .pn-program-top .row [class*='col-']{width: 50%;}
}
@media only screen and (max-width: 480px){
    .pn-program-top .row [class*='col-']{width: 100%;margin-bottom: 20px;}
}
