body {word-break:keep-all; }
.mo { display:none !important; }

/* 서브페이지 키비쥬얼 */
#SUB_KEYVISUAL .gu_sub_top .kv_img_area {background-image: url('../../../../img/sustainability/social/KV_visual.png');}
.gu_content h2.gu_title { padding-bottom: 110px; }
.gu_tab_depth4 ul li { min-width:50% !important; width:50% !important; }

.sec * { box-sizing: border-box; }
.sec + .sec { margin-top:100px; }
.sec .bx + .bx { margin-top:100px; }
.sec .bx > .title { color: #222; font-size: 32px; font-weight: 700; line-height: 1.4; letter-spacing: -0.8px; margin-bottom:24px; }
.sec .bx > .title span { color: #63666A; font-size: 14px; font-weight: 400; }
.sec .bx > .title.small { color: #000; font-size: 20px; font-weight: 500; letter-spacing: -0.4px; }
.sec .bx > .desc { color: #666; font-size: 16px; font-weight: 400; line-height: 1.75; letter-spacing: -0.4px; }
.sec .bx > .desc span { font-size:15px; }

.gu_circle_wr .gu_circle_out { padding:30px; }
.gu_circle_wr .gu_circle_in { width:29%; }
.gu_circle_wr .gu_circle_in .desc { font-weight:700; margin:0; }
.gu_circle_wr .gu_circle_in .desc span { color: #014099; }

.itemwr { display:flex; justify-content: space-between; margin-top:45px; gap:clamp(50px, 7vw, 105px); }
.itemwr .item { width:100%; }
.itemwr .item .img img { display:block; max-width:80px; }
.itemwr .item .tit { color: #000; font-size: 30px; font-weight: 700; line-height: 1.5; letter-spacing: -0.3px; margin:18px 0 12px; }
.itemwr .item .des { color: #63666A; font-size: 20px; font-weight: 500; line-height: 1.4; }
.itemwr .item .des p { display:flex; justify-content: flex-start; }
.itemwr .item .des p:before { content:"-"; display:block; }

.info { color: #63666A; font-size: 14px; font-weight: 400; line-height: 1.4; letter-spacing: -0.28px; margin-top:15px; }
.info p { text-indent: -11px; padding-left: 11px; }

.btnwr { text-align: center; }
.btn { display:inline-flex; justify-content: center; align-items: center; color: #FFF; font-size: 18px; font-weight: 700; line-height: 1.4; letter-spacing: -0.45px; margin:100px auto 0; background: #222; padding: 20px 60px; gap:10px; }
.btn:after { content:""; display:block; width:16px; height:auto; aspect-ratio: 1/1; background:url('../../../../img/sustainability/social/contribution/ico-outlink.png') center / 100% auto no-repeat; }

#OVERVIEW .section01 .imgwr.bg { width:100%; background:url('../../../../img/sustainability/social/contribution/tab01_sec01_img01.jpg') center / cover no-repeat; aspect-ratio: 960/285; margin-bottom:100px; }
#OVERVIEW .section01 .imgwr.sym { width:100%; background:url('../../../../img/sustainability/social/contribution/tab01_sec01_img02.png') center / 260px auto no-repeat; aspect-ratio: 955/314; border: 1px solid #E0E0E0; margin-top:55px; }

#HYUNDAI-1PERCENT-FOUNDATION .section01 .imgwr.bg { width:100%; background:url('../../../../img/sustainability/social/contribution/tab02_sec01_img01.jpg') center / cover no-repeat; aspect-ratio: 960/285; margin-bottom:100px; }

/* ================================== Tablet css ================================== */
@media all and (max-width: 1080px) {
    .gu_circle_wr .gu_circle_out { flex-direction: row; }
}

/* ================================== Mobile css ================================== */
@media all and (max-width: 766px) {
    .pc { display:none !important;; }
    .mo { display:block !important;; }
    .gu_content h2.gu_title { padding-bottom:80px; }

    .sec + .sec { margin-top:70px; }
    .sec .bx + .bx { margin-top:70px; }
    .sec .bx > .title { font-size: 24px; margin-bottom:18px; }
    .sec .bx > .title span { font-size: 14px; }
    .sec .bx > .title.small { font-size:17px; }
    .sec .bx > .title.small.center { text-align: center; }
    .sec .bx > .desc { font-size: 15px; line-height: 1.45; }
    .sec .bx > .desc span { font-size:15px; }

    .gu_circle_wr .gu_circle_out { flex-direction: column; }
    .gu_circle_wr .gu_circle_in { width:100%; padding:20px; }
    .gu_circle_wr .gu_circle_in .desc { font-size:14px; }

    .itemwr { flex-direction: column; align-items: center; }
    .itemwr .item { width:70%; }
    .itemwr .item .img img { width:30%; }
    .itemwr .item .tit { font-size: 24px; margin:15px 0 10px; }
    .itemwr .item .des { font-size: 15px; }

    .btn { width:100%; font-size: 16px; margin:70px auto 0; padding: 15px; gap:8px; }

    #OVERVIEW .section01 .imgwr.bg { background-image:url('../../../../img/sustainability/social/contribution/tab01_sec01_img01_m.jpg'); aspect-ratio: 360/400; margin-bottom:70px; }
    #OVERVIEW .section01 .imgwr.sym {  aspect-ratio: 335/320; margin-top:30px; }

    #HYUNDAI-1PERCENT-FOUNDATION .section01 .imgwr.bg { background-image:url('../../../../img/sustainability/social/contribution/tab02_sec01_img01_m.jpg'); aspect-ratio: 364/400; margin-bottom:70px; }
}