@charset "UTF-8";
/* --------------------- sec 1 start--------------------- */
.sec_1 .container .wrapper .lawyer_area ul {
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(40px, 4.17vw, 80px) clamp(10px, 1.04vw, 20px);
}
.sec_1 .container .wrapper .lawyer_area ul li:nth-child(4n + 1) {
    transition-delay: 0.1s;
}
.sec_1 .container .wrapper .lawyer_area ul li:nth-child(4n + 2) {
    transition-delay: 0.2s;
}
.sec_1 .container .wrapper .lawyer_area ul li:nth-child(4n + 3) {
    transition-delay: 0.3s;
}
.sec_1 .container .wrapper .lawyer_area ul li:nth-child(4n + 4) {
    transition-delay: 0.4s;
}
.sec_1 .container .wrapper .lawyer_area ul li:hover dl dt {
    display: inline-block;
    color: #bc9c5f;
}
.sec_1 .container .wrapper .lawyer_area ul li:hover dl dt::before {
    width: 100%;
}
.sec_1 .container .wrapper .lawyer_area ul li .thumb_area {
    position: relative;
    height: unset;
    padding-bottom: 127%;
    background: #e5e5e5;
    border-radius: 10px;
}
.sec_1 .container .wrapper .lawyer_area ul li .thumb_area img {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 96%;
}
.sec_1 .container .wrapper .lawyer_area ul li dl dt {
    font-weight: 700;
    font-size: 18px;
    position: relative;
    transition: color 0.4s;
}
.sec_1 .container .wrapper .lawyer_area ul li dl dt::before {
    position: absolute;
    content: "";
    width: 0%;
    height: 2px;
    bottom: 0;
    right: 0;
    background: #bc9c5f;
    transition: 0.4s;
}
.sec_1 .container .wrapper .lawyer_area ul li dl dt span {
    font-size: clamp(28px, 1.88vw, 36px);
    line-height: 1.19; /* 43px */
    padding-right: 0.52vw; /*10px*/
}
.sec_1 .container .wrapper .lawyer_area ul li dl dd {
    font-size: clamp(15px, 0.89vw, 17px);
    color: #555555;
}

/* --------------------- RWD --------------------- */
@media (max-width: 1100px) {
    .sec_1 .container .wrapper .lawyer_area ul {
        grid-template-columns: repeat(3, 1fr);
    }
    .sec_1 .container .wrapper .lawyer_area ul li:nth-child(3n + 1) {
        transition-delay: 0.1s;
    }
    .sec_1 .container .wrapper .lawyer_area ul li:nth-child(3n + 2) {
        transition-delay: 0.2s;
    }
    .sec_1 .container .wrapper .lawyer_area ul li:nth-child(3n + 3) {
        transition-delay: 0.3s;
    }
}
@media (max-width: 750px) {
    .sec_1 .container .wrapper .lawyer_area ul {
        grid-template-columns: repeat(2, 1fr);
        gap: 10.67vw 2.67vw;
    }
    .sec_1 .container .wrapper .lawyer_area ul li:nth-child(2n + 1) {
        transition-delay: 0.1s;
    }
    .sec_1 .container .wrapper .lawyer_area ul li:nth-child(2n + 2) {
        transition-delay: 0.2s;
    }
    .sec_1 .container .wrapper .lawyer_area ul li dl dt {
        font-size: clamp(15px, 4vw, 30px);
    }
    .sec_1 .container .wrapper .lawyer_area ul li dl dt span {
        font-size: clamp(21px, 6.13vw, 46px);
        padding-right: 1.33vw;
    }
    .sec_1 .container .wrapper .lawyer_area ul li dl dd {
        padding-top: 1.87vw; /*14px*/
        font-size: clamp(12px, 3.47vw, 26px);
        line-height: 1.38; /* 36px */
    }
}
/* 버튼 hover용 */
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 #1e3960;
    }
}
@keyframes pulse_green {
    0% {
        box-shadow: 0 0 0 0 #82a006;
    }
}
@keyframes pulse_red {
    0% {
        box-shadow: 0 0 0 0 #d65047;
    }
}
@keyframes pulse_yellow {
    0% {
        box-shadow: 0 0 0 0 #eeab00;
    }
}
@keyframes pulse_white {
    0% {
        box-shadow: 0 0 0 0 #fff;
    }
}
@keyframes pulse_sky_blue {
    0% {
        box-shadow: 0 0 0 0 #4380d6;
    }
}