

.footer_wrap{
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 100px;
}

.footer_top_box{
    width: 100%;
    display: flex;
    background: var(--Footer_Green1);
    border-radius: 40px;
    transform: translateY(40px);
    padding: 64px 48px;
    gap: 50px;
    align-items: center;
    justify-content: space-between;
}

.footer_info_box{
    display: flex;
}

.footer_info_ul{
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.footer_info_list{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer_info_kate_text{
    font-size: 12px;
    font-weight: var(--bold);
    color: var(--green-300);
}

.footer_info_info_text{
    font-size: 24px;
    font-weight: var(--medium);
    color: var(--white);
}

.footer_logo_box{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.footer_logo_img{
    width: 346px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.footer_bottom_box{
    width: 100%;
    display: flex;
    background: var(--Footer_Green2);
    padding: 100px 48px 48px 48px;
    gap: 50px;
    align-items: flex-end;
    justify-content: space-between;
}

.footer_copy_box{
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.footer_copy_ul{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer_copy_list{
    display: flex;
}

.footer_copy_list a{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 2px;
}

.footer_copy_text{    
    font-size: 14px;
    font-weight: var(--bold);
    color: #fff;
    letter-spacing: 0.5px;
}

.copy_blank_arrow_img{
    width: 18px;
    object-fit: contain;
}

.footer_copylight_text{
    font-size: 14px;
    font-weight: var(--medium);
    color: #7E867B;
}

/* 셀렉트 박스 */
.footer_select_wrap{
    display: flex;
}

.footer_select_ul {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
}

.footer_select_list {
    width: 100%;
}

.related_btn {
    background: #1A2218;
    width: 100%;
    min-width: 250px;
    min-height: 56px;
    padding: 5px 20px;
    border-radius: 16px;
    transition: background 0.3s ease;
}

.related_btn:hover {
    background: var(--primary-color);
}

.related_btn_txt {
    color: var(--white);
    font-size: 14px;
    font-weight: var(--medium);
    letter-spacing: 0.5px;
}

.related_list_box {
    bottom: 47px;
    background: var(--green-400);
    max-height: 145px;
    overflow-y: auto;
    border-radius: 16px;
}

.related_list_box.on {
    bottom: 62px;
}

.related_list {
    border-bottom: 1px solid var(--green-200);
    display: flex;
}

.related_list:last-child {
    border-bottom: 0px solid #ffffff3b;
}

.related_list a {
    padding: 14px 0;
    display: flex;
    width: 100%;
    height: 100%;
}

.related_list a span {
    font-size: 14px;
    font-weight: var(--medium);
    color: var(--white);
}

.footer_copy_list:first-child .footer_copy_text {
    color: var(--yw_color);
}








/* 반응형 */
@media(max-width : 1920px){
}

@media(max-width : 1480px){
    .footer_select_ul {flex-wrap: wrap; max-width: 508px;}
    .footer_select_list {width: calc(50% - 4px);}
    .footer_info_info_text {font-size: 20px;}
    .footer_logo_img {width: 224px;}
    .footer_top_box {padding: 56px 48px;}
    .footer_bottom_box {padding: 88px 48px 48px 48px;}
}

@media(max-width : 1240px){
}

@media(max-width : 1024px){
    .footer_top_box {flex-direction: row-reverse; padding: 32px;}
    .footer_logo_img {width: 203px;}
    .footer_info_info_text {font-size: 16px;}
    .footer_bottom_box {align-items: center; flex-direction: column;}
    .footer_copy_box {width: 100%; align-items: center;}
    .footer_copy_ul {flex-direction: row; align-items: center;}
    .footer_select_wrap {width: 100%; justify-content: center;}
    .footer_wrap {margin-top: 64px;}
    .footer_copylight_text{text-align: center;}
}

@media(max-width : 768px){
    .footer_top_box {flex-direction: column-reverse; gap: 42px; padding: 40px 20px;}
    .footer_info_box {width: 100%; justify-content: center; text-align: center;}
    .footer_bottom_box {
        padding: 88px 20px 48px 20px;
    }
}

@media(max-width : 564px){
    .footer_copy_ul {flex-direction: column;}
    .footer_select_ul {max-width: 100%; justify-content: center;}
    .footer_select_list {width: 100%; max-width: 250px;}
}

@media(max-width : 400px){
}