@charset "utf-8";

#history {}
#history .cont + .cont {
    margin-top:50px;
}
#history .info_wrap {
    background-color:#F8F9FA;
    border-radius:30px;
    padding:30px;
    display:flex;
    align-items:stretch;
    gap:10px;
}
#history .info_wrap ul {
    flex:1;
    display:flex;
    align-items:center;
    gap:10px;
    background-color:#FFF;
    border:1px solid #E0E0E0;
    border-radius:15px;
    padding:10px 20px;
}
#history .info_wrap .info_ti {
    font-size:1.11rem;
    font-weight:700;
}
#history .info_wrap .info_co {
    flex:1;
    font-size:1.05rem;
    font-weight:400;
    letter-spacing:-0.57px;
}




#history .history_tab {
    display:flex;
    align-items:stretch;
    justify-content:center;
    gap:10px;
    margin-bottom:50px;
}
#history .history_tab li {
    width:fit-content;
    padding:15px 20px;
    border:1px solid #E0E0E0;
    background-color:#fff;
    border-radius:15px;
}
#history .history_tab li a {
    font-size:1.11rem;
    font-weight:500;
    text-align:center;
    color:#173C7B;
    font-family: "Gmarket Sans";
}
#history .history_tab li.active {
    border-color:#173C7B;
    background-color:#EDF6FB;
}



#history .view_wrap {
    position: relative;
    display:flex;
    flex-direction:column;
    gap:100px;
}
#history .view_wrap::before {
    content:'';
    width:1px;
    height: calc(100% + 17px);
    background-color:#E0E0E0;
    position:absolute;
    left: 210px;
    top: 13px;
}
#history .view_cont {
    display:flex;
    align-items:flex-start;
    gap:100px;
    padding:0 20px;
}
#history .view_cont .his_yy {
    width:145px;
}
#history .view_cont .his_yy p {
    font-size:2rem;
    font-weight:500;
    color:#173C7B;
    font-family: "Gmarket Sans";
    text-align:right;
    position: relative;
}
#history .view_cont .his_yy p::before {
    content: '';
    width: 26px;
    height: 24px;
    background-image: url(../../../img/layout/cont_title_point.png);
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
#history .view_cont .his_yy p::after {
    content:'';
    width:80px;
    height:1px;
    background-color:#E0E0E0;
    position:absolute;
    right:-85px;
    top:30%;
}
#history .view_cont .his_box {
    flex:1;
    display:flex;
    flex-direction:column;
    gap:20px;
}
#history .view_cont .his_box .his_text {
    display:flex;
    align-items:center;
    align-items:flex-start;
}
#history .view_cont .his_box .his_text .his_mm {
    width:50px;
    font-size:1.11rem;
    font-weight:700;
    color:#173C7B;
}
#history .view_cont .his_box .his_text .his_ti {
    flex:1;
    display:flex;
    flex-direction:column;
    gap:5px;
}
#history .view_cont .his_box .his_text .his_ti li {
    font-size:1rem;
    font-weight:400;
    position: relative;
    padding-left:25px;
}
#history .view_cont .his_box .his_text .his_ti li::before {
    content:'';
    width:5px;
    height:5px;
    background-color:#333;
    border-radius:999px;
    position:absolute;
    left:8px;
    top:8px;
}








/****************************************/
/* 반응형 미디어 쿼리 css                 */
/***************************************/
@media (max-width:1680px) {}
@media (max-width:1440px) {
    #history .info_wrap {
        flex-wrap: wrap;
    }
    #history .info_wrap ul {
        flex:none;
        width:calc(50% - 5px);
    }
}
@media (max-width:1200px) {}
@media (max-width:1024px) {}
@media (max-width:991px) {
    #history .view_wrap::before {
        height: calc(100% + 7px);
    }
}
@media (max-width:768px) {
    #history .view_cont {
        gap:60px;
        padding:0;
    }
    #history .view_wrap::before {
        height: calc(100% + 9px);
        top: 12px;
        left: 161px;
    }
    #history .view_cont .his_yy {
        width:125px;
    }
    #history .view_cont .his_yy p::after {
        width:40px;
        right:-55px;
    }
}
@media (max-width:640px) {
    #history .info_wrap {
        padding:20px;
        border-radius:20px;
        flex-direction:column;
    }
    #history .info_wrap ul {
        width:100%;
    }

    #history .history_tab li {
        padding:10px;
    }


    #history .view_wrap::before {
        display:none;
    }
    #history .view_cont {
        flex-direction:column;
        padding:0 10px;
        gap:30px;
        position: relative;
    }
    #history .view_cont::after {
        content:'';
        width:100%;
        height:0;
        position:absolute;
        bottom:-50px;
        left:0;
        border-top:1px dashed #E0E0E0;
    }
    #history .view_cont:last-child:after {
        display:none;
    }
    #history .view_cont .his_yy p::after {
        display:none;
    }

}
@media (max-width:480px) {}