/* choose */
.pn-choose{margin-bottom: 60px;position: relative}
.pn-choose:before,.pn-choose:after{content: "";position: absolute;background-repeat: no-repeat;background-size: contain}
.pn-choose:before{left: 0;top: -60px;width: 239px;height: 589px;background-image: url(../images/before-choose.png);}
.pn-choose:after{width: 850px;height: 510px;background-image: url(../images/bg-effective.png);top: -60px;right: 0}
.pn-choose .pn-wrapper-item{background-repeat: no-repeat;background-size: contain;background-position: top center;min-height: 525px;background-size: 435px}
.pn-choose .pn-wrapper-item{padding-top: 100px}
.pn-choose .pn-item{width: calc(100% / 3);display: block;margin-top: 60px}
.pn-choose .pn-item:nth-child(even){float: right;padding-left: 60px}
.pn-choose .pn-item:nth-child(odd){text-align: right;padding-right: 60px}
.pn-choose .pn-item:nth-child(1),.pn-choose .pn-item:nth-child(2){margin-top: 0}
.pn-choose .pn-item .pn-image{width: 45px;height: 45px;line-height: 45px;border-radius: 100px;background-color: #ff4d2b;display: inline-block;margin-bottom: 10px}
.pn-choose .pn-item:nth-child(4n + 1) .pn-image{background-color: #5e9f59;}
.pn-choose .pn-item:nth-child(4n + 2) .pn-image{background-color: #f68f29;}
.pn-choose .pn-item:nth-child(4n + 3) .pn-image{background-color: #e95d3a;}
.pn-choose .pn-item:nth-child(4n + 4) .pn-image{background-color: #167287;}
.pn-choose .pn-item .pn-image:hover img{transform: inherit;-moz-transform: inherit;-webkit-transform: inherit}
.pn-choose .pn-item .pn-name{display: block;font-weight: bold;text-transform: uppercase;margin-bottom: 5px;font-size: 16px;line-height: 21px}
.pn-choose .pn-item .pn-wrapper{white-space: break-spaces}
/* course */
.pn-course{text-align: center;margin-bottom: 60px;position: relative;overflow: hidden;background-color: #f0f9fe;padding: 50px 0;}
.pn-course .pn-title{margin-bottom: 45px}
.pn-course .owl-carousel .pn-item{margin-bottom: 30px}
.pn-course .owl-carousel .pn-item .pn-image{border-radius: 100%;margin-bottom: 20px;padding: 4px}
.pn-course .owl-carousel .pn-item .pn-image img{border-radius: 100%}
.pn-course .owl-carousel .owl-item:nth-child(5n + 1) .pn-item .pn-image{background: rgb(66,247,180);background: -moz-linear-gradient(top, rgba(66,247,180,1) 0%, rgba(31,203,179,1) 100%);background: -webkit-linear-gradient(top, rgba(66,247,180,1) 0%,rgba(31,203,179,1) 100%);background: linear-gradient(to bottom, rgba(66,247,180,1) 0%,rgba(31,203,179,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42f7b4', endColorstr='#1fcbb3',GradientType=0 )}
.pn-course .owl-carousel .owl-item:nth-child(5n + 2) .pn-item .pn-image{background: rgb(249,167,252);background: -moz-linear-gradient(top, rgba(249,167,252,1) 0%, rgba(251,116,137,1) 100%);background: -webkit-linear-gradient(top, rgba(249,167,252,1) 0%,rgba(251,116,137,1) 100%);background: linear-gradient(to bottom, rgba(249,167,252,1) 0%,rgba(251,116,137,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9a7fc', endColorstr='#fb7489',GradientType=0 )}
.pn-course .owl-carousel .owl-item:nth-child(5n + 3) .pn-item .pn-image{background: rgb(50,205,251);background: -moz-linear-gradient(top, rgba(50,205,251,1) 0%, rgba(18,122,239,1) 100%);background: -webkit-linear-gradient(top, rgba(50,205,251,1) 0%,rgba(18,122,239,1) 100%);background: linear-gradient(to bottom, rgba(50,205,251,1) 0%,rgba(18,122,239,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#32cdfb', endColorstr='#127aef',GradientType=0 )}
.pn-course .owl-carousel .owl-item:nth-child(5n + 4) .pn-item .pn-image{background: rgb(254,160,111);background: -moz-linear-gradient(top, rgba(254,160,111,1) 0%, rgba(254,183,80,1) 100%);background: -webkit-linear-gradient(top, rgba(254,160,111,1) 0%,rgba(254,183,80,1) 100%);background: linear-gradient(to bottom, rgba(254,160,111,1) 0%,rgba(254,183,80,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fea06f', endColorstr='#feb750',GradientType=0 )}
.pn-course .owl-carousel .owl-item:nth-child(5n + 5) .pn-item .pn-image{background: rgb(254,63,96);background: -moz-linear-gradient(top, rgba(254,63,96,1) 0%, rgba(253,47,59,1) 100%);background: -webkit-linear-gradient(top, rgba(254,63,96,1) 0%,rgba(253,47,59,1) 100%);background: linear-gradient(to bottom, rgba(254,63,96,1) 0%,rgba(253,47,59,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe3f60', endColorstr='#fd2f3b',GradientType=0 )}
.pn-course .owl-carousel .pn-item .pn-image:hover img{transform: scale(0.95);-moz-transform: scale(0.95);-webkit-transform: scale(0.95)}
.pn-course .owl-carousel .pn-item .pn-name-category{display: inline-block;background-color: rgb(32 205 179 / 20%);color: #1fcbb3;font-weight: 500;font-size: 14px;line-height: 19px;border-radius: 5px;padding: 3px 25px;margin-bottom: 10px}
.pn-course .owl-carousel .pn-item .pn-name-category.active{color: #ff4e2c;background-color: rgb(255 78 44 / 20%)}
.pn-course .owl-carousel .pn-item .pn-name{font-size: 20px;line-height: 25px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;font-weight: bold;display: block;margin-bottom: 10px}
.pn-course .owl-carousel .pn-item .pn-name + p{font-size: 16px;line-height: 24px;margin-bottom: 0}
.pn-course .owl-carousel .owl-nav div{width: 40px;height: 40px;border: 2px solid #000;color: #000;background-color: #fff;border-radius: 100px;opacity: 1;visibility: visible;line-height: 35px;position: inherit;display: inline-block;margin: 0 15px}
.pn-course .owl-carousel .owl-nav div:hover{background-color: #ff6243;color: #fff;border-color: #ff6243}
/* detail */
.pn-detail{margin-bottom: 30px}
.pn-detail .pn-title{margin-bottom: 30px}
.pn-detail .pn-title + .pn-wrapper{margin-top: 0}

@media only screen and (max-width: 1499px){
    .pn-choose .pn-wrapper-item{padding-top: 80px}
    .pn-choose:before{width: 200px}
    .pn-choose:after{width: 500px}
}
@media only screen and (max-width: 1199px){
    .pn-choose .pn-wrapper-item{background-size: 300px;background-position: center}
}
@media only screen and (max-width: 991px){
    .pn-choose .pn-title span{display: block;margin-bottom: 5px}
    .pn-course{margin-bottom: 0;padding: 30px 0}
    .pn-choose .pn-wrapper-item{background-size: 350px;padding-top: 30px;min-height: 450px;}
    .pn-course .owl-carousel{padding: 0}
    .pn-choose .pn-content{padding: 30px 30px 0 30px}
}
@media only screen and (max-width: 767px){
    .pn-choose{margin-bottom: 30px}
    .pn-choose:before,.pn-choose:after{display: none}
    .pn-choose .pn-wrapper-item{background-image: none !important;padding-top: 0;margin: 0 -15px;min-height: inherit}
    .pn-choose .pn-wrapper-item > div{display: flex;flex-wrap: wrap}
    .pn-choose .pn-item{width: 50%;margin-top: 30px;padding: 0 15px}
    .pn-choose .pn-item:nth-child(odd){text-align: center;padding-right: 15px}
    .pn-choose .pn-item:nth-child(even){float: none;padding-left: 15px;text-align: center}
    .pn-course .pn-item .pn-name{font-size: 14px;line-height: 19px}
}
@media only screen and (max-width: 480px){
    .pn-choose .pn-item{width: 100%;}
    .pn-choose .pn-item:nth-child(2){margin-top: 30px;}
}