@charset "UTF-8";
.lawyer_view_main {
    background: #f8f8f8;
}

/* --------------------- sec 1 start--------------------- */
.sec_1 .container .wrapper .thumb_area {
    margin-right: 4.17vw; /*80px*/
    width: clamp(200px, 24.38vw, 468px);
}
.sec_1 .container .wrapper .thumb_area img {
    background: #e5e5e5;
    /*position: sticky;
    top: 120px;*/
}
.sec_1 .container .wrapper .info_area {
    width: calc(100% - clamp(200px, 24.38vw, 468px) - 4.17vw);
}
.sec_1 .container .wrapper .info_area .lawyer dt {
    font-weight: 700;
    font-size: clamp(17px, 0.94vw, 18px);
}
.sec_1 .container .wrapper .info_area .lawyer dt span {
    font-size: clamp(30px, 1.88vw, 36px);
    padding-right: 10px;
}
.sec_1 .container .wrapper .info_area .lawyer dd {
    font-size: clamp(15px, 0.89vw, 17px);
    color: #555555;
}
.sec_1 .container .wrapper .info_area .greetings {
    position: relative;
}
.sec_1 .container .wrapper .info_area .greetings::after {
    position: absolute;
    content: "";
    width: 50px;
    height: 2px;
    top: 0;
    left: 0;
    background: #bc9c5f;
}
.sec_1 .container .wrapper .info_area .greetings .tit {
    font-size: clamp(20px, 1.25vw, 24px);
    line-height: 1.21; /* 29px */
    font-weight: 700;
}
.sec_1 .container .wrapper .info_area .greetings .txt {
    font-size: clamp(16px, 0.94vw, 18px);
    line-height: 1.67; /* 30px */
    color: #444;
}
.sec_1 .container .wrapper .info_area .greetings .blog_link {
    margin-top: 2.08vw; /*40px*/
    line-height: 3.17; /* 57px */
    font-size: clamp(15px, 0.94vw, 18px);
    max-width: clamp(240px, 16.82vw, 323px);
    border: 1px solid #ddd;
    border-radius: 10px;
    background: #fff;
}
.sec_1 .container .wrapper .info_area .greetings .blog_link i {
    margin-left: 12px;
    width: clamp(20px, 1.46vw, 28px);
    height: clamp(17px, 1.3vw, 25px);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url(../img/blog_ico.png);
}
.sec_1 .container .wrapper .info_area .category {
    background: #f8f8f8;
    position: sticky;
    top: 30px;
    left: 0;
    z-index: 2;
    align-self: flex-start;
}
.sec_1 .container .wrapper .info_area .cont dl:not(.cate1) {
    display: none;
}
.sec_1 .container .wrapper .info_area .cont dl dt {
    font-size: clamp(20px, 1.35vw, 26px);
    font-weight: 700;
}
.sec_1 .container .wrapper .info_area .cont dl dd {
    font-size: clamp(16px, 0.94vw, 18px);
    line-height: 2; /* 36px */
    padding-left: 10px;
    position: relative;
}
.sec_1 .container .wrapper .info_area .cont dl dd::before {
    position: absolute;
    content: "";
    width: 2px;
    height: 2px;
    border-radius: 100%;
    background: #222;
    top: 16px;
    left: 0;
}

/* --------------------- RWD --------------------- */
@media (max-width: 750px) {
    .lawyer_view_main {
        background: unset;
        overflow-x: hidden;
    }
    .sec_1 .container .wrapper {
        flex-wrap: wrap;
        width: 100%;
    }
    .sec_1 .container .wrapper .thumb_area {
        width: calc(100% - 12.26vw);
        margin: 0 auto;
    }
    .sec_1 .container .wrapper .info_area {
        width: 100%;
    }
    .sec_1 .container .wrapper .info_area .lawyer {
        width: calc(100% - 12.26vw);
        margin: 0 auto;
    }
    .sec_1 .container .wrapper .info_area .lawyer dt {
        font-size: clamp(18px, 4vw, 30px);
    }
    .sec_1 .container .wrapper .info_area .lawyer dt span {
        font-size: clamp(32px, 6.67vw, 50px);
        padding-right: 1.33vw; /*10px*/
    }
    .sec_1 .container .wrapper .info_area .lawyer dd {
        font-size: clamp(16px, 4vw, 30px);
    }
    .sec_1 .container .wrapper .info_area .greetings {
        width: calc(100% - 12.26vw);
        margin: 0 auto;
    }
    .sec_1 .container .wrapper .info_area .greetings::after {
        width: 80px;
        height: 4px;
    }
    .sec_1 .container .wrapper .info_area .greetings .tit {
        font-size: clamp(24px, 4.8vw, 36px);
        line-height: 1.44; /* 52px */
    }
    .sec_1 .container .wrapper .info_area .greetings .txt {
        font-size: clamp(17px, 4vw, 30px);
        line-height: 1.67; /* 50px */
        word-break: break-all;
    }
    .sec_1 .container .wrapper .info_area .greetings .blog_link {
        max-width: unset;
        width: 100%;
        font-size: clamp(14px, 4vw, 30px);
        line-height: 3.33; /* 100px */
        margin-top: 8vw; /*60px*/
    }
    .sec_1 .container .wrapper .info_area .greetings .blog_link i {
        width: clamp(20px, 6.67vw, 50px);
        height: clamp(18px, 5.87vw, 44px);
        margin-left: 2.67vw; /*20px*/
    }
    .sec_1 .container .wrapper .info_area .category {
        margin-left: 6.13vw;
        background: #fff;
        position: inherit;
        top: unset;
        left: unset;
    }
    .sec_1 .container .wrapper .info_area .cont {
        width: calc(100% - 12.26vw);
        margin: 0 auto;
    }
    .sec_1 .container .wrapper .info_area .cont dl dt {
        font-size: clamp(26px, 4.8vw, 36px);
    }
    .sec_1 .container .wrapper .info_area .cont dl dd {
        font-size: clamp(16px, 4vw, 30px);
        line-height: 1.67; /* 50px */
        padding-left: 15px;
    }
    .sec_1 .container .wrapper .info_area .cont dl dd::before {
        width: clamp(2px, 0.53vw, 4px);
        height: clamp(2px, 0.53vw, 4px);
        top: 3.47vw; /*26px*/
    }
}
/* 버튼 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;
    }
}
