.step_sub {border-bottom:1px solid #ddd}
.step_sub .inner{width:1300px;margin:0 auto;max-width: 100%;}
.step_sub .inner>ul{display: flex;}
.step_sub li.home{text-align: center;background:none;width:60px;padding:0;}
.step_sub li.home a{padding: 0; text-align: center; color: #215c47;}
.step_sub li.home img{vertical-align: -3px;}
.step_sub li{text-align:center;display:inline-block;position:relative;}
.step_sub li{box-sizing:border-box;width: 300px; height: 60px; line-height: 60px;}
.step_sub li:last-child .menu{color: #fff; background-color: #215c47;}
.step_sub .menu_list {width: 100%;z-index:999;display:none;box-sizing:border-box;position:absolute;background:#fff;left:0;top:60px;border:0; border-top: 1px solid #ddd;


    -moz-box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.11);
    -webkit-box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.11);
    box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.11);


}
.step_sub .menu_list li a{color:#000;font-weight:300;}
.step_sub li {
    background: none;
    box-sizing: content-box;
    text-align: center;
    border-left: 1px solid #dddddd;
}
.step_sub li a{display:block; text-align: left; padding: 0 20px; box-sizing: border-box; font-size: 16px; line-height: 60px; transition: all .3s; letter-spacing: -1px;}
.step_sub .menu_list li{display:block;border:0; border-bottom: 1px solid #ddd;}
.step_sub .menu_list li:last-child{border-bottom: none;}
.step_sub li .tab{display:block;}
.step_sub .menu_list li{padding:0;}

.step_sub .menu .arrow {
    position: absolute;
    right: 30px;
    top: 0px;
    font-size: 12px;
    transition: transform 0.3s ease;
}

.step_sub .tab.active .menu .arrow {
    transform: rotate(180deg); /* 화살표 위로 */
}

.step_sub .menu_list li.active a {
    background-color: #215c47;
    color: #fff;

}

.step_sub .menu_list li:hover a{
    background-color: #215c47;
    color: #fff;
}

/* 상단 탭 a 공통: 한 줄 + 말줄임 */
.step_sub li a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 상단 탭 제목(.menu) 우측 화살표 공간 확보 */
.step_sub .menu {
    padding-right: 60px !important; /* 화살표(절대배치) + 여유 공간 */
}

/* 드롭다운 항목도 한 줄 + 말줄임 (화살표 없음이지만 안전하게) */
.step_sub .menu_list li a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 20px; /* 기존 값 유지 혹은 필요시 24~28로 */
}

/* 화살표는 클릭 방해 X */
.step_sub .menu .arrow {
    pointer-events: none;
    right: 20px; /* 필요시 20~24로 조정 */
}

/* 모바일에서도 동일하게 말줄임 + 화살표 공간 */
@media (max-width: 768px) {
    .step_sub .menu { padding-right: 40px !important; }
    .step_sub li a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}


@media (max-width: 768px) {
    .step_sub .inner {
        display: block;
        height: auto;
    }

    .step_sub ul {
        display: flex;
    }

    .step_sub li {
        width: auto;
        padding: 0;
        border-left: none;
        text-align: left;
        height: 40px;
        line-height: 40px;
    }

    .step_sub li a{padding: 0 15px; padding-right: 30px; font-size: 14px; line-height: 40px;}
    .step_sub .menu .arrow{right: 10px;}
    .step_sub li.home{display: none;}

    .step_sub .menu_list{top: 40px; min-width: 180px;}
}