/**
 * ITF Korea — 오시는 길
 * Figma 6065:9485 PC · 6126:13253 Tablet · 6126:13302 Mobile
 */

.itf-site .directions-sect {
    padding: var(--subContM) 0 var(--subContPd);
    background: #fff;
}

.itf-site .directions-sect > .in2 {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.itf-site .directions-sect__address {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.itf-site .directions-sect__address-tit {
    margin: 0;
    font-size: var(--subH2);
    font-weight: 700;
    line-height: var(--titLine);
    color: var(--txtBlack1);
}

.itf-site .directions-sect__address-txt {
    margin: 0;
    font-size: var(--txt);
    font-weight: 700;
    line-height: var(--txtLine);
    color: var(--txtGray1);
}

.itf-site .directions-sect__main {
    display: flex;
    flex-direction: column;
    gap: 48px;
    width: 100%;
}

/* —— Kakao map shell (Figma 지도 프레임) —— */
.itf-site .directions-sect__map .kakao-map-wrap {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.itf-site .directions-sect__map .kakao-map__canvas-wrap {
    min-height: 560px;
    height: 560px;
    border: 1px solid #e6e6e6;
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--lightBg);
}

.itf-site .directions-sect__map .kakao-map__canvas-wrap--rich {
    border-radius: var(--radius);
}

.itf-site .directions-sect__map .kakao-map__stage,
.itf-site .directions-sect__map .kakao-map__canvas,
.itf-site .directions-sect__map .kakao-map__placeholder {
    min-height: 560px;
    height: 100%;
}

/* —— 교통안내 —— */
.itf-site .directions-sect__traffic {
    display: flex;
    gap: 240px;
    align-items: flex-start;
    width: 100%;
}

.itf-site .directions-sect__traffic-tit {
    flex-shrink: 0;
    margin: 0;
    font-size: var(--mainH3);
    font-weight: 700;
    line-height: var(--titLine);
    color: var(--txtBlack1);
}

.itf-site .directions-sect__traffic-body {
    flex: 1 1 0;
    min-width: 0;
}

.itf-site .directions-sect__traffic-block {
    border-top: 1px solid var(--txtBlack1);
    padding-top: 24px;
}

.itf-site .directions-sect__traffic-block:first-child {
    padding-bottom: 48px;
}

.itf-site .directions-sect__traffic-block-tit {
    margin: 0 0 20px;
    font-size: var(--lgTxt);
    font-weight: 700;
    line-height: var(--txtLine);
    color: var(--txtBlack1);
}

.itf-site .directions-sect__route-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.itf-site .directions-sect__route {
    display: flex;
    gap: 12px;
    align-items: center;
}

.itf-site .directions-sect__badge {
    flex-shrink: 0;
    padding: 2px 12px;
    border-radius: 100px;
    font-size: var(--tinyTxt);
    font-weight: 500;
    line-height: var(--txtLine);
    color: #fff;
    white-space: nowrap;
}

.itf-site .directions-sect__badge--line-2 {
    background: #74c074;
}

.itf-site .directions-sect__badge--town {
    background: #92c537;
}

.itf-site .directions-sect__badge--branch {
    background: #5dc053;
}

.itf-site .directions-sect__badge--trunk {
    background: #416ce2;
}

.itf-site .directions-sect__route-txt {
    margin: 0;
    font-size: var(--txt);
    font-weight: 400;
    line-height: var(--txtLine);
    color: var(--txtGray1);
}

/* page-location — legacy kakao-map page styles off */
.itf-site.page-location .page-sub__body {
    padding: 0;
    max-width: none;
}

@media screen and (max-width: 1024px) {
    .itf-site .directions-sect__address {
        gap: 12px;
    }

    .itf-site .directions-sect__traffic {
        gap: 100px;
    }

    .itf-site .directions-sect__map .kakao-map__canvas-wrap,
    .itf-site .directions-sect__map .kakao-map__stage,
    .itf-site .directions-sect__map .kakao-map__canvas,
    .itf-site .directions-sect__map .kakao-map__placeholder {
        min-height: 500px;
        height: 500px;
    }
}

@media screen and (max-width: 768px) {
    .itf-site .directions-sect > .in2 {
        gap: 20px;
    }

    .itf-site .directions-sect__address {
        gap: 8px;
    }

    .itf-site .directions-sect__traffic {
        flex-direction: column;
        gap: 32px;
    }

    .itf-site .directions-sect__traffic-block:first-child {
        padding-bottom: 36px;
    }

    .itf-site .directions-sect__traffic-block {
        padding-top: 20px;
    }

    .itf-site .directions-sect__map .kakao-map__canvas-wrap,
    .itf-site .directions-sect__map .kakao-map__stage,
    .itf-site .directions-sect__map .kakao-map__canvas,
    .itf-site .directions-sect__map .kakao-map__placeholder {
        min-height: 380px;
        height: 380px;
    }
}