/**************************************** product 공통*/

.partner_sec1 .sub_banner_back {
    background-image: url(/img/sub03/sub03_banner_back.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

/**************************************** partner 시작*/

.par_s2_con_wrap{
    width: 100%;
    position: relative;
}

.par_s2_con_wrap > img{
    opacity: 0.35;
}

.par_s2_marker{
    width: 20px;
    height: 26px;
    background-image: url(/img/sub03/partner_sec2_pin.png);
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    transform: translate(-50%,-50%);
    z-index: 1;
}

.par_s2_marker.marker1{
    top: 42%;
    left: 19%;
}

.par_s2_marker.marker2{
    top: 39%;
    left: 46%;
}

.par_s2_marker.marker3{
    top: 34%;
    left: 47%;
}

.par_s2_marker.marker4{
    top: 32%;
    left: 48%;
}

.par_s2_marker.marker5{
    top: 31%;
    left: 48.5%;
}

.par_s2_marker.marker6{
    top: 38%;
    left: 50.5%;
}

.par_s2_marker.marker7{
    top: 46%;
    left: 56%;
}

.par_s2_marker.marker8{
    top: 50%;
    left: 68.5%;
}

.par_s2_marker.marker9{
    top: 41%;
    left: 73%;
}

.par_s2_marker.marker10{
    top: 55%;
    left: 74.5%;
}

.par_s2_marker.marker11{
    top: 50%;
    left: 80.2%;
}

.par_s2_marker.marker12{
    top: 42%;
    left: 85%;
}

.par_s2_marker.marker13{
    top: 83%;
    left: 88%;
}

.partner_sec3{
    background-color: #f6f6f6;
}

.par_s3_con_wrap{
    display: grid;
    justify-items: center;
    grid-template-columns: repeat(4, 1fr);
    row-gap: 40px;
    column-gap: 40px;
}

.par_s3_con{
    max-width: 300px;
    width: 100%;
    height: 175px;
    background-color: #fff;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.par_s3_cap{
    width: 100%;
    padding: 35px 15px 15px;
    position: absolute;
    bottom: -100%;
    display: flex;
    flex-direction: column;
    row-gap: 5px;
    transition: 0.4s;
    background-image: url(/img/sub03/partner_sec3_back.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 55%;
}

.par_s3_title{
    font-family: 'Pretendard-SemiBold';
    font-size: 1.0625rem;
    color: #fff;
}

.par_s3_subtitle{
    color: #fffaab;
    font-family: 'Pretendard-SemiBold';
    font-size: .9375rem;
}

.par_s3_con > img{
    transition: 0.4s;
    filter: grayscale(100%) opacity(50%);
    transform: translateY(0%);
}

.par_s3_con:hover > img,
.par_s3_con.active > img{
    filter: grayscale(0) opacity(100%);
    transform: translateY(-30%);
}

.par_s3_con:hover .par_s3_cap,
.par_s3_con.active .par_s3_cap{
    bottom: 0;
}

/**************************************** partner 끝*/



@media screen and (max-width: 1440px) {}

@media screen and (max-width: 1240px) {}

@media screen and (max-width: 1024px) {

    .par_s3_con_wrap {
        grid-template-columns: repeat(3, 1fr);
    }

}

@media screen and (max-width: 768px) {



}

@media screen and (max-width: 540px) {

    .partner_sec1 .sub_banner_back{
        background-position: 50% center;
    }

    .par_s2_marker {
        width: 12px;
        height: 16px;
    }

    .par_s3_con_wrap {
        grid-template-columns: 1fr;
        row-gap: 20px;
    }

    .par_s3_con{
        max-width: none;
    }

}

@media screen and (max-width: 414px) {}