/* 공통 */
h3.stit {
    font-size:2.6rem;
    color:#000;
    font-weight:800;
}



.ars-box {
    background:var(--symbol-color) url("../img/ethics_banner_bg.png") no-repeat right bottom;
    background-size:14.5rem auto;
    position:relative;
    padding:2rem 3rem 2rem 10rem;
    display:flex;
    overflow:hidden;
    align-items:center;
    /* justify-content:center; */
}
.ars-box .txt {
    font-size:2.2rem;
    color:#fff;
    text-align:left;
}
.ars-box .txt span {
    font-size:1.8rem;
}
.ars-box .tel {
    display:flex;
    align-items:center;
    margin-left:5rem;
    text-align:left;
}
.ars-box .tel:before {
    margin-right:2rem;
    display:inline-block;
    content:"";
    width:1.7rem;
    height:6.8rem;
    background:url("../img/sq_open.png") no-repeat center;
    background-size:1.7rem auto;
}
.ars-box .tel:after {
    margin-left:2rem;
    display:inline-block;
    content:"";
    width:1.7rem;
    height:6.8rem;
    background:url("../img/sq_close.png") no-repeat center;
    background-size:1.7rem auto;
}
.ars-box .tel p {
    padding-left:9rem;
    background:url("../img/icon_ars.png") no-repeat left center;
    background-size:6.8rem auto;
}
.ars-box .tel span {
    font-size:1.8rem;
    color:#fff;
    font-weight:600;
}
.ars-box .tel strong {
    font-size:3.6rem;
    color:#fff;
    font-weight:800;
}

@media all and (max-width:1200px) {
    .ars-box {
        flex-wrap:wrap;
        justify-content:left;
    }
    .ars-box .tel {
        margin-left:0;
        flex-basis:100%;
        margin-top:2rem;
    }
}
@media all and (max-width:640px) {
    .ars-box {padding:2rem 3rem;}
}
@media all and (max-width:480px) {
    .ars-box {padding:2rem 2rem;}
}



.campaign-box {
    position:relative;
    margin-top:5rem;
}
/* .campaign-box:after {
    display:block;
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:47%;
    height:100%;
    background:url("../img/sponsor_img.png") no-repeat right top;
    background-size:auto 100%;
    z-index:2;
} */
.campaign-box h3.stit {
    color:var(--symbol-color);
}
.campaign-box p.stxt {
    position:relative;
    margin-top:0.5rem;
    font-size:2.6rem;
    z-index:3;
}
.campaign-box ul {    
    margin-top:5rem;
    width:60%;   
}
.campaign-box ul li {
    position:relative;
    padding:3rem 8rem 3rem 3rem;
    background:#fff;
    z-index:0;
}
.campaign-box ul li .row {
    display:flex;
}
.campaign-box ul li.active {
    padding:4rem 4rem 4rem 4rem;
    border:solid 1px #000;
    -webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.42);
    -moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.42);
    box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.42);
    z-index:3;
}
.campaign-box ul li span.tt {
    font-size:1.8rem;
    color:#000;
}
.campaign-box ul li.active span.tt {
    font-size:2.2rem;
    font-weight:700;
}
.campaign-box ul li div strong {
    display:inline-block;
    font-size:2.8rem;
    color:#000;
    font-weight:600;
}
.campaign-box ul li.active strong {
    font-size:3.6rem;
    font-weight:800;
}
.campaign-box ul li dl {
    margin-top:3rem;
    border-top:solid 1px #eee;
    padding-top:3rem;
}
.campaign-box ul li dl dt {
    font-size: 1.8rem;
    color:#666;
}
.campaign-box ul li dl dd {
    
}
.campaign-box ul li dl dd span {
    display:inline-block;
    font-size:3.6rem;
    font-weight:800;
    color:#000;
    padding-left:3.5rem;
    background:url("../img/icon_ars3.png") no-repeat left center;
    background-size:2.6rem auto;
}
.campaign-box ul li .right {
    margin-left:auto;    
    display:flex;
    align-items:center;
}
.campaign-box ul li .right a {
    width:14rem;
}
.campaign-box ul li.active a {
    background:var(--symbol-color);
}
.campaign-box ul li p {
    font-size:1.8rem;
    color:#666;
}
.campaign-box ul li.active p {

}

@media all and (max-width:1280px) {
    .campaign-box:after {
        width:37%;
    }
    .campaign-box ul {  
        width:66%;   
    }
}
@media all and (max-width:1080px) {
    .campaign-box:after {
        width:27%;
    }
    .campaign-box ul {  
        width:76%;   
    }
}
@media all and (max-width:920px) {
    .campaign-box:after {
        width:17%;
    }
    .campaign-box ul {  
        width:86%;   
    }
}
@media all and (max-width:800px) {
    .campaign-box {
        padding-bottom:0;
    }
    .campaign-box:after {
        width:30rem;
        background:url("../img/sponsor_img.png") no-repeat right top;
        background-size:100% auto;
    }
    .campaign-box ul {  
        width:100%;   
    }
    .campaign-box ul li {
        padding:3rem 3rem 3rem 3rem;
    }
    .campaign-box ul li.active {
        padding:4rem 3rem 4rem 3rem;
    }
}
@media all and (max-width:740px) {
    .campaign-box:after {
        width:10rem;
    }
    .campaign-box h3.stit {
        padding-top:0;
    }
}
@media all and (max-width:580px) {
    .campaign-box:after {display:none;}
    .campaign-box ul li .row {
        flex-wrap:wrap;
    }
    .campaign-box ul li .right {
        margin-top:2rem;
        flex-basis:100%;
    }
}
@media all and (max-width:550px) {
    .campaign-box ul li {
        flex-wrap:wrap;
    }
    .campaign-box ul li .right {
        flex-basis:100%;
        margin-top:2rem;
    }
}
@media all and (max-width:480px) {
    .campaign-box ul li {
        padding:3rem 2rem 3rem 2rem;
    }
    .campaign-box ul li.active {
        padding:3rem 2rem 3rem 2rem;
    }
}
@media all and (max-width:380px) {
    .campaign-box ul li.active strong {
        font-size:3.2rem;
    }
}


.year-end {
    padding:3rem;
    border:solid 1px #ddd;
    background:#fafafa;
}
.year-end p + p {
    margin-top:1rem;
}
.year-end p span {
    color:#000;
}
.year-end p.notice {
    font-size:1.8rem;
    color:#000;
    font-weight:600;
}



.etc-box {

}
.etc-box ul {
    margin-top:2rem;
    margin-left:-2%;
    font-size:0;
    display:flex;
}
.etc-box ul li {
    display:inline-block;
    width:48%;
    margin-left:2%;
    vertical-align:top;
    padding-left:3rem;
    padding-top:20rem;
}
.etc-box ul li:nth-child(1) {
    background:url("../img/sponsor_etc1_big.png") no-repeat left top;
    background-size:100% auto;
}
.etc-box ul li:nth-child(2) {
    background:url("../img/sponsor_etc2_big.png") no-repeat left top;
    background-size:100% auto;
}
.etc-box ul li:nth-child(3) {
    background:url("../img/sponsor_etc3.png") no-repeat left top;
    background-size:100% auto;
}
.etc-box ul li .info {
    background:#fff;
    padding:3rem 0 0 3rem;
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    height:100%;
}
.etc-box ul li .info p.sbj {
    flex-basis:100%;
    font-size:2.2rem;
    color:#000;
    font-weight:600;
}
.etc-box ul li .info p.memo {
    flex-basis:100%;
    margin-top:1rem;
    font-size:1.8rem;
}
.etc-box ul li .info .btn {
    flex-basis:100%;
    align-self:flex-end;
    margin-top:1.5rem;
}
.etc-box ul li .info .btn a {
    display:inline-block;
    height:4rem;
    line-height:4rem;
    border:solid 1px var(--symbol-color);
    background:#fff;
    border-radius:2rem;
    font-size:1.5rem;
    color:var(--symbol-color);
    font-weight:700;
    padding:0 1.5rem;
}
.etc-box ul li .info .btn a.down span {
    display:inline-block;
    padding-right:3rem;
    background:url("../img/icon_down_red.png") no-repeat right center;
    background-size:2rem auto;
}

@media all and (max-width:1200px) {
    .etc-box ul li {
        padding-left:0;
    }
    .etc-box ul li:nth-child(1) {
        background:url("../img/sponsor_etc1_big.png") no-repeat center center;
        background-size:cover;
    }
    .etc-box ul li:nth-child(2) {
        background:url("../img/sponsor_etc2_big.png") no-repeat center center;
        background-size:cover;
    }
    .etc-box ul li:nth-child(3) {
        background:url("../img/sponsor_etc3.png") no-repeat center center;
        background-size:cover;
    }
    .etc-box ul li .info {
        padding-left:0;
    }
}
@media all and (max-width:920px) {
    .etc-box ul li .info p.sbj br {display:none;}
}
@media all and (max-width:580px) {
    .etc-box ul {
        flex-wrap:wrap;
        margin-left:0;
    }
    .etc-box ul li {
        display:inline-block;
        width:100%;
        margin-left:0;
        flex-basis:100%;
    }
    .etc-box ul li + li {
        margin-top:3rem;
    }
    .etc-box ul li .info {
        padding-top:2rem;
    }
}




.contact-ars {
    background:#fafafa;
    border:solid 1px #ddd;
    padding:3rem;
    display:flex;
    align-items:center;
    justify-content:center;
}
.contact-ars p {
    font-size:2rem;
    color:#000;
    font-weight:500;
}
.contact-ars p:after {
    display:inline-block;
    content:"";
    vertical-align:middle;
    width:5rem;
    height:1px;
    background:#000;
    margin:0 2rem;
}
.contact-ars .tel {
    padding-left:5rem;
    background:url("../img/icon_ars2.png") no-repeat left center;
    background-size:3.6rem auto;
    font-size:3.2rem;
    line-height:3.6rem;
    color:var(--symbol-color);
    font-weight:800;
}

@media all and (max-width:480px) {
    .contact-ars {
        flex-wrap:wrap;
        justify-content:left;
    }
    .contact-ars .tel {
        margin-top:2rem;
        flex-basis:100%;
    }
}



.sp-notice {
    
}
.sp-notice ul {
    margin-top:2rem;
    display:flex;
    margin-left:-2%;
}
.sp-notice ul li {
    width:23%;
    margin-left:2%;
    padding-top:13rem;
}
.sp-notice ul li:nth-child(1) {
    background:url("../img/icon_sp_nt1.png") no-repeat left top 3rem;
    background-size:6.7rem auto;
}
.sp-notice ul li:nth-child(2) {
    background:url("../img/icon_sp_nt2.png") no-repeat left top 3rem;
    background-size:5.1rem auto;
}
.sp-notice ul li:nth-child(3) {
    background:url("../img/icon_sp_nt3.png") no-repeat left top 3rem;
    background-size:4.8rem auto;
}
.sp-notice ul li:nth-child(4) {
    background:url("../img/icon_sp_nt4.png") no-repeat left top 3rem;
    background-size:6.3rem auto;
}
.sp-notice ul li span {
    display:inline-block;
    font-size:1.5rem;
    color:#000;
    font-weight:800;
    border-bottom:solid 3px #000;
}
.sp-notice ul li .sbj {
    margin-top:1rem;
    font-size:2.2rem;
    color:#000;
    font-weight:600;
}
.sp-notice ul li .memo {
    margin-top:2rem;
    font-size:1.8rem;
}

@media all and (max-width:1100px) {
    .sp-notice ul {
        flex-wrap:wrap;
    }
    .sp-notice ul li {
        width:48%;
        margin-bottom:3rem;
    }
}
@media all and (max-width:480px) {
    .sp-notice ul li {
        width:100%;
        padding-top:11rem;
    }
    .sp-notice ul li .memo br {
        display:none;
    }
}


.sp-account {
    border:solid 1px #ddd;
    background:#fafafa;
    padding:3rem;
}
.sp-account dt {
    padding-bottom:2rem;
    border-bottom:solid 1px #000;
    display:flex;
    align-items:center;
}
.sp-account dt .hd {
    display:inline-block;
    height:3.2rem;
    line-height:3.2rem;
    background:#000;
    border-radius:1.6rem;
    font-size:1.4rem;
    color:#fff;
    font-weight:700;
    padding:0 1.5rem;
    margin-right:2rem;
}
.sp-account dt em {
    display:inline-block;
    font-size:0;
    width:15.6rem;
    height:2.6rem;
    background:url("../img/kb_logo.png") no-repeat left center;
    background-size:15.6rem auto;
    margin-right:2rem;
}
.sp-account dt .kb em {
    background:url("../img/kb_logo.png") no-repeat left center;
    background-size:15.6rem auto;
}
.sp-account dt .nonghyup em {
    background:url("../img/nonghyup_logo.png") no-repeat left center;
    background-size:15.6rem auto;
}
.sp-account dt strong {
    font-size:2.4rem;
    color:#000;
    font-weight:800;
}
.sp-account dt .name {
    display:inline-block;
    margin-left:0.5rem;
    font-size:1.8rem;
    color:#000;
}
.sp-account dd {
    padding-top:2rem;
}
.sp-account dd li {
    margin-top:1rem;
    padding-left:1.5rem;
    text-indent:-1.5rem;
}

.sp-account .acc-wrap {
    flex: 1;
    display:flex;
    flex-direction:column;
    gap:1rem;
}
.sp-account .acc-wrap .acc-item {
    display:flex;
    align-items:center;
}



@media all and (max-width:860px) {
    .sp-account dt {
        flex-wrap:wrap;
        justify-content:start;
    }
    .sp-account .acc-wrap {
        row-gap:2rem;
    }
    .sp-account .acc-wrap .acc-item {
        flex-direction:column;
        align-items:flex-start;
        row-gap:0.5rem;
    }
    .sp-account dt > *:not(.hd) {
        flex-basis:100%;
        margin-top:1rem;
        margin-left:0;
    }
    .sp-account dt .hd {
        margin-bottom:1rem;
    }
}
@media all and (max-width:480px) {
    .sp-account {
        padding:3rem 2rem;
    }
}




/* 국민 후원금 모금 캠페인 */
.sp-center-banner {
    height:35rem;
    background:url("../img/sp_center_banner.jpg") no-repeat center;
    background-size:cover;
}

.sp-center-account-box {
    display:flex;
    border:solid 1px #000;
    background:#fff;
    margin:-11rem 6rem 0;
    padding:4rem;
    -webkit-box-shadow: 0.5rem 0.5rem 1rem 0 rgba(0,0,0,0.42);
    -moz-box-shadow: 0.5rem 0.5rem 1rem 0 rgba(0,0,0,0.42);
    box-shadow: 0.5rem 0.5rem 1rem 0 rgba(0,0,0,0.42);
}
.sp-center-account-box .left {
    border-right:solid 1px #ccc;
    padding-right:8rem;
}
.sp-center-account-box .left h3 img {
    width:13.6rem;
    height:auto;
}
.sp-center-account-box .left p {
    margin-top:2rem;
    font-size:2rem;
}
.sp-center-account-box .right {
    text-align:center;
    flex:1;
}
.sp-center-account-box .right .hd {
    display:inline-block;
    height:3.2rem;
    line-height:3.2rem;
    background:var(--symbol-color);
    border-radius:1.6rem;
    font-size:1.4rem;
    color:#fff;
    font-weight:700;
    padding:0 1.5rem;
}
.sp-center-account-box .right p {
    display:flex;
    align-items:center;
    margin-top:1rem;
    justify-content:center;
}
.sp-center-account-box .right p em {
    display:inline-block;
    font-size:0;
    width:15.6rem;
    height:2.6rem;
    background:url("../img/kb_logo.png") no-repeat left center;
    background-size:15.6rem auto;
    margin-right:2rem;
}
.sp-center-account-box .right p strong {
    font-size:3.8rem;
    color:#000;
    font-weight:800;
}
.sp-center-account-box .right .name {
    margin-left:3rem;
    display:inline-block;
    font-size:1.8rem;
    color:#000;
}
.sp-center-account-box .right .name.ho {
    margin-left:8rem;
}

@media all and (max-width:1280px) {
    .sp-center-account-box {
        flex-wrap:wrap;
    }
    .sp-center-account-box .left {
        flex-basis:100%;
        text-align:center;
        padding-right:0;
        border-right:none;
    }
    .sp-center-account-box .right {
        margin-top:4rem;
        flex-basis:100%;
    }
}
@media all and (max-width:860px) {
    .sp-center-account-box {
        margin:-11rem 3rem 0;
    }
    .sp-center-account-box .right p {
        flex-wrap:wrap;
        margin-top:2rem;
    }
    .sp-center-account-box .right p strong {
        flex-basis:100%;
        margin-top:1rem;
    }
    .sp-center-account-box .right .name {
        margin-left:0;
    }
    .sp-center-account-box .right .name.ho {
        margin-left:0;
    }
}
@media all and (max-width:520px) {
    .sp-center-account-box {
        margin:-11rem var(--container-padding) 0;
    }
    .sp-center-account-box .right p strong {
        font-size:2.8rem;
    }
}


.sp-center-list {
    padding:0 6rem;
}
.sp-center-list dl {
    margin-top:5rem;
}
.sp-center-list dl dt span {
    display:inline-block;
    height:3.2rem;
    line-height:3.2rem;
    padding:0 1.5rem;
    background:#000;
    font-size:1.4rem;
    color:#fff;
    font-weight:700;
    text-align:center;
    border-radius:1.6rem;
    width:8rem;
}
.sp-center-list dl dd {
    padding-top:2rem;
}
.sp-center-list dl dd p b {
    font-size:1.8rem;
    color:#000;
    font-weight:normal;
}
.sp-center-list dl dd p + p {
    margin-top:1rem;
}
.sp-center-list dl dd p.ind {
    font-size:1.6rem;
}
.sp-center-list dl dd p.ind strong {
    color:var(--symbol-color);
    font-weight:600;
}

.sp-center-list dl dd ul li {
    font-size:1.6rem;    
}
.sp-center-list dl dd ul li + li {
    margin-top:1.5rem;
}

@media all and (max-width:860px) {
    .sp-center-list {
        padding:0 3rem;
    }
}
@media all and (max-width:520px) {
    .sp-center-list {
        padding:0 var(--container-padding);
    }
}

.sp-center-contact {
    margin-top:5rem;
    border:solid 1px #ddd;
    background:#fafafa;
    padding:4rem 6rem;
    display:flex;
    align-items:center;
}
.sp-center-contact .left p {
    font-size:1.8rem;
    color:#000;
    font-weight:600;
}
.sp-center-contact .left div {
    margin-top:2rem;
}
.sp-center-contact .left div span {
    display:inline-block;
    padding-left:4rem;
    line-height:2.9rem;
    background:url("../img/sponsor_tel.png") no-repeat left center;
    background-size:2.9rem auto;
    margin-right:1rem;
    font-size:1.8rem;
    color:#000;
}
.sp-center-contact .left div strong {
    font-size:2rem;
    color:var(--symbol-color);
    font-weight:800;
}
.sp-center-contact .right {
    margin-left:auto;
}
.sp-center-contact .right a {
    display:inline-block;
    height:4.8rem;
    line-height:4.8rem;
    padding:0 2rem;
    border-radius:5px;
    background:#112c56;
    font-size:1.6rem;
    color:#fff;
    font-weight:500;
}

@media all and (max-width:1100px) {
    .sp-center-contact {
        flex-wrap:wrap;
    }
    .sp-center-contact .left {
        flex-basis:100%;
    }
    .sp-center-contact .right {
        flex-basis:100%;
        margin-top:3rem;
    }
}
@media all and (max-width:860px) {
    .sp-center-contact {
        padding:4rem 3rem;
    }
}
@media all and (max-width:520px) {
    .sp-center-contact {
        padding:4rem var(--container-padding);
    }
}