@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');

#guide {
    margin-top:-20px;
    border-radius: 30px;
    border: 5px solid rgba(123, 73, 146, 0.10);
    padding:50px;
}
#guide .guide_title {
    display:flex;
    align-items:flex-start;
    gap:50px;
}
#guide .guide_title .guide_img {
    max-width:466px;
}
#guide .guide_title .guide_img img {
    width:100%;
    border-radius: 15px;
}
#guide .guide_title .guide_info {
    flex:1;
}
#guide .guide_title .guide_info .guide_title {
    font-size:1.44em;
    font-weight:500;
    font-family: "The Jamsil";
    color:#7B4992;
    letter-spacing:-0.78px;
    line-height:1.38;
    padding-bottom:20px;
}
#guide .guide_title .guide_info .guide_info_box {
    padding-top:20px;
    border-top:1px solid rgba(123, 73, 146, 0.40);
    display:flex;
    flex-direction:column;
    gap:10px;
}
#guide .guide_title .guide_info .guide_info_box ul {
    display:flex;
    align-items:flex-start;
    gap:10px;
}
#guide .guide_title .guide_info .guide_info_box .info_box_ti {
    display:flex;
    align-items:center;
    gap:5px;
}
#guide .guide_title .guide_info .guide_info_box .info_box_ti p {
    width:65px;
    font-size:1em;
    font-weight:700;
    color:#7B4992;
}
#guide .guide_title .guide_info .guide_info_box .info_box_co {
    flex:1;
    font-size:1em;
    font-weight:400;
    line-height:1.44;
}
#guide .guide_title .guide_info .guide_info_box .info_box_co a:hover {
    color:#7B4992;
}




/* 반응형 미디어쿼리 css */
@media (max-width:1680px) {
    #guide .guide_title .guide_img {
        max-width:420px;
    }
}
@media (max-width:1440px) {
    #guide .guide_title {
        gap:30px;
    }
}
@media (max-width:1200px) {
    #guide .guide_title {
        flex-direction: column;
    }
    #guide .guide_title .guide_img {
        margin:auto;
    }
}
@media (max-width:1024px) {}
@media (max-width:991px) {}
@media (max-width:768px) {
    #guide {
        padding:30px;
    }
}
@media (max-width:640px) {
    #guide .guide_title .guide_info .guide_info_box {
        gap:20px;
    }
    #guide .guide_title .guide_info .guide_info_box ul {
        flex-direction:column;
    }


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