@charset "utf-8";

/* 후원 종류 */
.supportGuide .supportWrap .supportInfo {display: grid; grid-template-columns: 230px repeat(3,1fr); gap: 10px;}

.supportGuide .supportWrap .supportInfo li {border: 1px solid #ddd; border-radius: 30px; padding:60px;}
.supportGuide .supportWrap .supportInfo li:nth-child(1) {background: var(--base3) url(/images/support/ico_support00.svg) no-repeat right 15px bottom; color: #fff; padding: 35px; border-radius: 30px; margin-right:10px}

.supportGuide .supportWrap .supportInfo li:nth-child(2) {background: #fff url(/images/support/ico_support01.svg) no-repeat right 60px top 50px;}
.supportGuide .supportWrap .supportInfo li:nth-child(3) {background: #fff url(/images/support/ico_support02.svg) no-repeat right 60px top 50px;}
.supportGuide .supportWrap .supportInfo li:nth-child(4) {background: #fff url(/images/support/ico_support03.svg) no-repeat right 60px top 50px;}

.supportGuide .supportWrap .supportInfo li span {display: block; font-weight: 300; margin-top: 25px;}
.supportGuide .supportWrap .supportInfo li p {font-weight: 700; font-size: var(--fs22); color: var(--base3);}

.supportGuide .supportWrap .sponsorGuide .info {padding-left: 30px; background: url(/images/support/ico_info.svg) no-repeat center left; margin-top: 20px; color: var(--base3); line-height: 1.2;}
.supportGuide .supportWrap .sponsorGuide ul {display: grid; grid-template-columns: auto auto; gap:20px;}
.supportGuide .supportWrap .sponsorGuide ul li {border-radius: 30px; background: var(--base3) url(/images/support/ico_support04.svg) no-repeat top 50px right 60px; color: #fff; padding: 50px 60px;}
.supportGuide .supportWrap .sponsorGuide ul li:first-child {font-size:24px;}
.supportGuide .supportWrap .sponsorGuide ul li:last-child {background: #F5F5F7 url(/images/support/ico_support05.svg) no-repeat top 50px right 60px; color: var(--black);}
.supportGuide .supportWrap .sponsorGuide ul li span {position: relative; font-size: var(--fs24); padding-top:10px; font-weight: 700;}
.supportGuide .supportWrap .sponsorGuide ul li span:before {position: absolute; content: ""; width: 45px; height: 3px; left: 0; top: 0; background: #fff;}
.supportGuide .supportWrap .sponsorGuide ul li:last-child span:before {background: var(--black);}
.supportGuide .supportWrap .sponsorGuide ul li div {margin-top: 40px;}
.supportGuide .supportWrap .sponsorGuide ul li div p {line-height: 1.4; font-weight: 300;}
.supportGuide .supportWrap .sponsorGuide ul li div p strong {font-weight: 600; padding-right:8px;}



/* ************************ 태블릿 (~1249) ************************ */
@media screen and (max-width:1249px) {

    .supportGuide .supportWrap .supportInfo {grid-template-columns: repeat(3, 1fr);}
    .supportGuide .supportWrap .supportInfo li:first-child {grid-column: 1 / -1; margin-right: 0 !important; height: 120px; background-size: 80px;}

}



/* ************************ 태블릿 (~991) ************************ */
@media screen and (max-width:991px) {

    .supportGuide .supportWrap .supportInfo { grid-template-columns: auto;}
    .supportGuide .supportWrap .supportInfo li {padding: 35px;}
    .supportGuide .supportWrap .sponsorGuide ul {grid-template-columns: auto;}

}



/* ************************ 모바일 (~767) ************************ */
@media screen and (max-width:767px) { 



}


/* ************************ 모바일 (~500) ************************ */
@media screen and (max-width:500px) {

    .supportGuide .supportWrap .supportInfo li {background-position: right 35px top 35px !important;}
    .supportGuide .supportWrap .supportInfo li:first-child {background-size: 80px;}

    .supportGuide .supportWrap .supportInfo li span {margin-top: 20px;}

    .supportGuide .supportWrap .sponsorGuide .info {background: url(/images/support/ico_info.svg) no-repeat top 2px left;}
    .supportGuide .supportWrap .sponsorGuide ul li {padding: 40px; background-size: 50px !important; background-position: top 20px right 20px !important;}
    .supportGuide .supportWrap .sponsorGuide ul li div {margin-top: 20px;}
    



}