/* service */
.service{word-break: keep-all;
}
.service .s1 .img_area{
    position: relative;
    min-height: 500px;
}
.service .s1 .img_area::before{
    content: '';
    display: block;
    padding-bottom: calc(1300/1920*100%);
}
.service .s1 .img_area img{
    position: absolute;
    top: 0;left: 0;
    width: 100%;height: 100%;
    object-fit: cover;
}
.service .s1 .img_area ._txtBx{
    position: absolute;
    bottom:12%; left:50%;
    transform: translateX(-50%);
    z-index:41;color:#fff;
    font-size:80px; font-weight:400; line-height:1.2;
    font-family: var(--font2);
    display:flex; align-items: center; justify-content: center;
    flex-direction: column;
    /* gap: 60px; */
    width: 95%;
    text-align: center;
}
.service .s1 .img_area ._txtBx p{margin-bottom: max(0.2em,10px);}
.service .s1 .img_area ._txtBx > div{
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.service .s1 .img_area ._txtBx span{
    font-family: var(--font);
    font-size: 24px;
	line-height: 1.4;
	display: block; margin-bottom: 0.5em;
}
.service .s1 .img_area ._txtBx small{
    font-size: 18px;
    font-family: 'Pretendard';
    display: block;text-align: center;
    line-height: 1.4;
}
br._m{display: none;}

.service .main-section-4{
    padding-bottom: 150px;
}

@media screen and (max-width: 1680px){
    .service .s1 .img_area ._txtBx{
        font-size: clamp(70px, 70 / 1440 * 100vw, 80px);
    }
}
@media screen and (max-width: 1440px){
    .service .s1 .img_area ._txtBx{
        font-size: clamp(60px, 60 / 1280 * 100vw, 70px);
    }
}
@media screen and (max-width: 1280px){
    .service .s1 .img_area ._txtBx{
        font-size: clamp(50px, 50 / 1024 * 100vw, 60px);
        /* gap: 40px; */
    }
    .service .s1 .img_area ._txtBx span{font-size: clamp(22px, 22 / 1024 * 100vw, 24px);}
    .service .s1 .img_area ._txtBx small{font-size: clamp(16px, 16 / 1024 * 100vw, 18px);}
}
@media screen and (max-width: 1024px){
    .service .s1 .img_area ._txtBx{
        font-size: clamp(40px, 40 / 820 * 100vw, 50px);
        /* gap: 30px; */
    }
    .service .s1 .img_area ._txtBx span{font-size: clamp(20px, 20 / 820 * 100vw, 22px);}
}
@media screen and (max-width: 820px){
    .service .main-section-4{padding-bottom: 100px;}
    .service .s1 .img_area ._txtBx{
        font-size: clamp(30px, 30 / 500 * 100vw, 40px);
        gap: 5px;
        bottom: 5%;
    }
    .service .s1 .img_area ._txtBx br._m{display: block;}
    .service .s1 .img_area ._txtBx span{font-size: clamp(16px, 16 / 500 * 100vw, 20px);}
    .service .s1 .img_area ._txtBx small{font-size: clamp(16px, 16 / 500 * 100vw, 20px);}
}
@media screen and (max-width: 500px){
    /* .service .s1 .img_area ._txtBx{
        font-size: clamp(25px, 25 / 360 * 100vw, 30px);
    } */
    .service .s1 .img_area ._txtBx span{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
    .service .s1 .img_area ._txtBx small{font-size: clamp(14px, 14 / 360 * 100vw, 16px);}
}
@media screen and (max-width: 360px){
    .service .s1 .img_area ._txtBx br._m{display: none;}
    .service .s1 .img_area ._txtBx span{font-size: clamp(12px, 12 / 360 * 100vw, 14px);}
    .service .s1 .img_area ._txtBx small{font-size: clamp(12px, 12 / 360 * 100vw, 14px);}
}
