@charset "UTF-8";

.contents_box .contents_section:has(.meracle_diagram) {
    padding-top:120px;
}
.meracle_diagram {
    margin-top:60px;
    padding:60px;
    background-color:#F9FAFC;
    text-align:center;
}
.meracle_vision {
    margin-bottom:55px;
}
.meracle_vision .badge_vision {
    display:inline-block;
    padding:10px 20px;
    background-color:#DFE1E5;
    border-radius:4px;
    font-size:1.8rem;
    font-weight:600;
    line-height:1.5;
}
.meracle_vision .text_vision_title {
    margin-top:40px;
    font-size:2.8rem;
    line-height:1.4;
    font-weight:600;
}
.meracle_vision .text_vision_logo {
    margin-top:20px;
    font-size:8rem;
    line-height:1.4;
    font-weight:700;
}
.list_vision_pillar {
    display:flex;
    gap:20px;
    margin-top:50px;
}
.list_vision_pillar .item_vision_pillar {
    flex:1;
    padding:30px;
    background-color:#fff;
    border-radius:16px;
}
.list_vision_pillar .title_pillar {
    padding-bottom:30px;
    border-bottom:1px solid #D9D9D9;
    font-size:2.8rem;
    line-height:1.4;
    font-weight:600;
}
.list_vision_pillar .text_pillar_initial {
    color:#5EBE01;
}
.list_vision_pillar .desc_pillar {
    margin-top:30px;
    font-size:2rem;
    line-height:1.4;
    color:#333;
}
.meracle_divider {
    width:100%;
    height:80px;
    background:url("/img/sustainability/community/img_meracle_divider-3cad1adb05060281f7b8cdb7f3c84aeb.png") no-repeat center / 1040px auto;
}
.meracle_activity {
    margin-top:40px;
}
.meracle_activity .list_activity {
    display:flex;
    gap:20px;
}
.meracle_activity .item_activity {
    flex:1;
    padding:40px;
    background-color:#E7F8D9;
    border-radius:16px;
    text-align:center;
}
.meracle_activity .label_activity {
    display:block;
    font-size:2rem;
    line-height:1.4;
    font-weight:600;
    color:#5EBE01;
}
.meracle_activity .title_activity {
    margin-top:16px;
    font-size:3rem;
    line-height:1.4;
    font-weight:600;
}
.meracle_activity .desc_activity {
    margin-top:24px;
    font-size:1.8rem;
    line-height:1.5;
}
.meracle_notice {
    margin-top:80px;
}
.meracle_notice .content_half_list {
    gap:32px;
}
.meracle_notice .content_half_list li {
    width:33.333%;
}
.cj_campaign .img_box {
    display:flex;
    gap:32px;
}
.cj_campaign .img_box > img {
    width:calc((100% - 32px)/2);
}

/* Mobile (1169.98px 이하) */
@media only screen and (max-width: 1169.98px) {
    .contents_box .contents_section:has(.meracle_diagram) {
        padding-top:0;
    }
    .meracle_diagram {
        margin-top:40px;
        padding:20px;
        background-color:#F9FAFC;
        text-align:center;
    }
    .meracle_vision {
        margin-bottom:24px;
    }
    .meracle_vision .badge_vision {
        padding:6px 16px;
        border-radius:2px;
        font-size:1.2rem;
        font-weight:600;
        line-height:1.4;
    }
    .meracle_vision .text_vision_title {
        margin-top:24px;
        font-size:1.6rem;
        line-height:1.5;
        font-weight:600;
    }
    .meracle_vision .text_vision_logo {
        margin-top:24px;
        font-size:4rem;
        line-height:1.4;
        font-weight:700;
    }
    .list_vision_pillar {
        flex-direction:column;
        gap:16px;
        margin-top:24px;
    }
    .list_vision_pillar .item_vision_pillar {
        padding:20px;
        border-radius:16px;
    }
    .list_vision_pillar .title_pillar {
        padding-bottom:16px;
        font-size:2rem;
        line-height:1.4;
        font-weight:600;
    }
    .list_vision_pillar .desc_pillar {
        margin-top:16px;
        font-size:1.6rem;
        line-height:1.4;
        color:#333;
    }
    .meracle_divider {
        width:100%;
        height:40px;
        background:url("/img/sustainability/community/img_meracle_divider_mo-cf294ba00965b69b1eb69982ef824de0.png") no-repeat center / 280px auto;
    }
    .meracle_activity {
        margin-top:24px;
    }
    .meracle_activity .list_activity {
        flex-direction:column;
        gap:20px;
    }
    .meracle_activity .item_activity {
        padding:30px 20px;
    }
    .meracle_activity .label_activity {
        font-size:1.6rem;
        line-height:1.5;
        font-weight:700;
    }
    .meracle_activity .title_activity {
        margin-top:8px;
        font-size:2rem;
        line-height:1.4;
        font-weight:600;
    }
    .meracle_activity .desc_activity {
        margin-top:16px;
        font-size:1.6rem;
        line-height:1.5;
    }
    .meracle_notice {
        margin-top:40px;
    }
    .meracle_notice .content_half_list {
        gap:40px;
    }
    .meracle_notice .content_half_list li {
        width:100%;
    }
    .meracle_notice .content_half_list li .text_num {
        margin-bottom:8px;
    }
    .meracle_notice .content_half_list li .text_label {
        font-size:2rem;
        line-height:1.4em;
        font-weight:600;
    }
    .cj_campaign .img_box {
        flex-direction:column;
        gap:16px;
    }
    .cj_campaign .img_box > img {
        width:100%;
    }
}