@import url('sub.css');

/* 서비스 */
.service_cont li {display: flex; align-items: center; gap: 100px;}
.service_cont li:nth-child(2n) {flex-direction: row-reverse;}
.service_cont li + li {margin-top: 100px;}
.service_cont li .imgbox {width: 50%; max-width: 780px; flex-shrink: 0;}
.service_cont li .imgbox img {max-width: 100%; height: auto;}
.service_cont li .txtbox {flex: 1;}
.service_cont li .txtbox p.fs24 {margin-bottom: 20px;}
.service_cont li .txtbox p.fs50 {margin-bottom: 30px; text-wrap: balance;}
.service_cont li .txtbox .fs20_wrap {display: flex; flex-direction: column; gap: 20px;}


/*******************************************************************************
    @media 1770px
*******************************************************************************/
@media all and (max-width:1770px){

}

/*******************************************************************************
    @media 1500px
*******************************************************************************/
@media all and (max-width:1500px){
/* 서비스 */
.service_cont li .txtbox .fs20_wrap br {display: none;}
}

/*******************************************************************************
    @media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){
/* 서비스 */
.service_cont li {gap: 60px;}
.service_cont li .txtbox p.fs24 {font-size: 1.2rem; margin-bottom: 15px;}
.service_cont li .txtbox p.fs50 {text-wrap: initial; font-size: 2rem; margin-bottom: 20px;}
.service_cont li .txtbox p.fs50 br {display: none;}
.service_cont li .txtbox .fs20_wrap {gap: 15px;}
}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){
/* 서비스 */
.service_cont li {gap: 40px; align-items: flex-start;}
.service_cont li + li {margin-top: 60px;}
.service_cont li .txtbox p.fs24 {margin-bottom: 5px;}
.service_cont li .txtbox .fs20_wrap {gap: 10px;}
}

/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){
/* 서비스 */
.service_cont li {flex-direction: column !important; gap: 20px;}
.service_cont li + li {margin-top: 40px;}
.service_cont li .imgbox {width: 100%; max-width: 100%;}
.service_cont li .txtbox {width: 100%;}
.service_cont li .txtbox p.fs50 {margin-bottom: 10px;}
.service_cont li .txtbox .fs20_wrap {gap: 0;}
}