@charset "utf-8";
.map {overflow:hidden}
.map .root_daum_roughmap .wrap_controllers {display: none;}
.map .root_daum_roughmap .cont {display: none;}
.map .root_daum_roughmap .wrap_map {height:460px;}
.map .root_daum_roughmap .map_border {z-index:1}
.map .root_daum_roughmap .wrap_btn_zoom {z-index:2}
.road {display:flex;margin: 80px 0 120px;gap: 4%;}
.road h4 {position: relative;text-align: left;font-size: var(--sub-h4-size);}

.adr {
    width: 100%;
    border: 1px solid #ddd;
    padding: 3rem;
}
.road > div dl {display:flex;flex-wrap:wrap;gap: 1rem 0;padding-top: 2rem;}
.road > div dl dt {width: 12%;font-weight: 600;}
.road > div dl dd {width: 88%;}
.road > div dl dd span {display: inline-block;vertical-align: middle;}
.adr .local {width: 14%;text-align: center;background-color: #dbf1ff;border-radius: 1rem;position: relative;}
.adr .local a {
    display: block;
    padding: 1rem;
    width: 100%;
    height: 100%;
    /* color: var(--color-main); */
    font-weight: 600;
}
.traffic {width: 100%;border: 1px solid #ddd;padding: 3rem;}

.traffic dd .num {display: inline-flex;width: 24px;height: 24px;background-color: #8936e0;color: #fff;font-size: 14px;font-weight: 500;align-items: center;justify-content: center;border-radius: 50%;margin-right: .5rem;}
.traffic dd li {padding-top:.5rem}
.traffic dd li .num {width: 3rem;border-radius: 1rem;}
.traffic dd li:first-child .num {background-color:#289AC2}
.traffic dd li:nth-child(2) .num {background-color:#349F1A}

/* PC */ 
@media only screen and (min-width:1024px) and (max-width: 1400px)  {
    .road {gap:3rem;}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1023px) {
    .road {flex-wrap:wrap;gap: 4rem;}
    .road h4.v_left {padding-bottom: 1rem;}
    .road > div dl {padding-top:1.5rem}
    
}

/* 모바일 가로, 모바일 세로 (해상도 ~ 767px)*/ 
@media all and (max-width:767px) {
    .road {margin:4rem 0}
    .road > div dl {gap:.4rem 0;padding-top: .5rem;font-size: clamp(.9rem, 4.5vw, 1rem);}
    .road > div dl dt {width: 20%;}
    .road > div dl dd {width: 80%;word-break: keep-all;line-height: 1.5;}
    .adr, .traffic {padding:2rem}
}