.setting-banner {
    position: relative;
    display: block;
    overflow: hidden;
  }
  
  .setting-banner__list {
    display: block;
  }
  
  .setting-banner__list > li {
    display: block;
  }
  
  .setting-banner__list > li ~ li {
    margin-top: 1.7rem;
  }
  
  .setting-banner__item {
    display: flex;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
  }
  
  .setting-banner__item:focus {
    outline: -webkit-focus-ring-color auto 5px;
  }
  
  .setting-banner__con {
    flex: auto;
    display: flex;
    flex-direction: column;
    font-weight: 400;
    text-align: left;
    padding: 3.4rem 5.1rem;
    z-index: 100;
  }
  
  .setting-banner__con .dep {
    color: #26282c;
    font-size: 1.9rem;
    line-height: 1.2;
  }
  
  .setting-banner__con .cardname {
    position: absolute;
    top: auto;
    left: 2.4rem;
    bottom: 3.6rem;
    opacity: 0;
    transition: all 1s;
    position: absolute;
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: bold;
    color: #26282c;
    transform: translateX(-100%);
  }
  
  .setting-banner__con .tit {
    display: inline;
    color: #26282c;
    font-size: 3.4rem;
    font-weight: 600;
    line-height: 1.2;
    word-break: keep-all;
  }
  
  .setting-banner__con .tit > br {
    line-height: 100%;
  }
  
  .setting-banner__con .txt {
    color: #26282c;
    font-size: 1.7rem;
    line-height: 1.5;
  }
  
  .setting-banner__con .txt .go::after {
    content: "";
    display: inline-block;
    width: .6rem;
    height: .6rem;
    border-top: 1px solid;
    border-right: 1px solid;
    transform: rotate(45deg);
    vertical-align: middle;
    margin: 0 0 1px 4px;
  }
  
  .setting-banner__con.ta-c {
    text-align: center;
  }
  
  .setting-banner__con.ta-l {
    text-align: left;
  }
  
  .setting-banner__con.ta-r {
    text-align: right;
  }
  
  .setting-banner__img {
    flex: none;
    position: relative;
    display: block;
    width: 30%;
  }
  
  .setting-banner__img img {
    position: absolute;
    right: 5.1rem;
    top: 50%;
    width: auto;
    height: auto;
    transform: translateY(-50%);
  }
  
  .setting-banner .swiper-wrap {
    position: relative;
    width: 100%;
    height: 100%;
  }
  
  .setting-banner .swiper-container {
    position: static;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
  }
  
  .setting-banner .swiper-wrapper {
    height: 100%;
  }
  
  .setting-banner .swiper-dot {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1.7rem;
    height: auto;
    font-size: 0;
    text-align: center;
    z-index: 10;
  }
  
  .setting-banner .swiper-pagination {
    position: static;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 24px;
    line-height: 100%;
    font-size: 1.6rem;
    letter-spacing: 1px;
    margin-top: 0;
    vertical-align: middle;
  }
  
  .setting-banner .swiper-pagination.swiper-pagination-fraction {
    background-color: rgba(0, 0, 0, .16);
    border-radius: 12px;
    padding: 0 8px;
  }
  
  .setting-banner .swiper-pagination-bullet {
    transition: all .3s;
  }
  
  .setting-banner .swiper-wrap__btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    vertical-align: middle;
    border-radius: 0;
  }
  
  .setting-banner .swiper-wrap__btn:after {
    position: static;
    height: 10px;
  }
  
  .setting-banner .swiper-button-control {
    width: 2.6rem;
    height: 2.6rem;
    margin-left: .8rem;
    margin-top: 0;
    background: url(https://img1.kbcard.com/home_re/mo/ico/24/ico-pause.svg) no-repeat center;
  }
  
  .setting-banner .swiper-button-control.play {
    background-image: url(https://img1.kbcard.com/home_re/mo/ico/24/ico-play.svg);
  }
  
  .setting-banner.pc-main {
    float: left;
    width: 670px;
    height: 260px;
    border-radius: 1.7rem;
  }
  
  .setting-banner.pc-main .setting-banner__item {
    padding: 0 3.4rem;
  }
  
  .setting-banner.pc-main .setting-banner__con .dep {
    font-size: 1.9rem;
  }
  
  .setting-banner.pc-main .setting-banner__con .tit {
    padding: 1.7rem 0 2.6rem 0;
  }
  
  .setting-banner.pc-main .swiper-container {
    border-radius: 1.7rem;
  }
  
  .setting-banner.pc-card .setting-banner__item {
    border-radius: 1.7rem;
  }
  
  .setting-banner.pc-card .setting-banner__con .dep {
    padding-bottom: 1.7rem;
  }
  
  .setting-banner.pc-card .setting-banner__con .tit {
    font-size: 2.6rem;
    padding: 0 0 1.9rem 0;
  }
  
  .setting-banner.pc-card .setting-banner__con .txt {
    font-size: 1.7rem;
  }
  
  .setting-banner.pc-card .setting-banner__img {
    width: 20%;
  }
  
  .setting-banner.pc-card .setting-banner__img img {
    width: 120px;
    height: auto;
  }
  
  .setting-banner.mo-main {
    height: 32rem;
    border-radius: 1.7rem;
    background-color: #fff;
    box-shadow: 0 .1rem .3rem 0 rgba(0, 0, 0, .16);
  }
  
  .setting-banner.mo-main .swiper-slide {
  	overflow: hidden;
  }
  
  .setting-banner.mo-main .setting-banner__item {
    flex-direction: column;
    border-radius: 0;
  }
  
  .setting-banner.mo-main .setting-banner__con {
    flex: none;
    padding: 2.4rem;
  }
  
  .setting-banner.mo-main .setting-banner__con .dep {
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 600;
  }
  
  .setting-banner.mo-main .setting-banner__con .tit {
    font-size: 2rem;
    padding: .4rem 0 1.7rem 0;
    line-height: 1.4;
    font-weight: 600;
  }
  
  .setting-banner.mo-main .setting-banner__con .txt {
    font-size: 1.5rem;
  }
  
  .setting-banner.mo-main .setting-banner__img {
    flex: auto;
    width: 100%;
    max-width: 328px;
    margin: 0 auto;
  }
  
  .setting-banner.mo-main .swiper-container {
    border-radius: 1.7rem;
  }

  .setting-banner.mo-main .swiper-dot {
    bottom:1.6rem;
  }

  .setting-banner.mo-main .swiper-button-control {
    width:2.4rem;
    height:2.4rem;
    margin-left: .4rem;
  }
  
  .setting-banner.mo-myevent {
    height: 44rem;
    border-radius: 1.7rem;
    background-color: #fff;
    box-shadow: 0 .1rem .3rem 0 rgba(0, 0, 0, .16);
  }
  
  .setting-banner.mo-myevent .setting-banner__item {
    flex-direction: column;
    border-radius: 0;
    padding-top: 10.7rem;
  } 
  
  .setting-banner.mo-myevent .setting-banner__con {
    flex: none;
    padding: 3.4rem 2.6rem;
  }
  
  .setting-banner.mo-myevent .setting-banner__con .dep {
    font-size: 1.5rem;
  }
  
  .setting-banner.mo-myevent .setting-banner__con .tit {
    font-size: 1.9rem;
    padding: .8rem 0 1.7rem 0;
  }
  
  .setting-banner.mo-myevent .setting-banner__con .txt {
    font-size: 1.5rem;
  }
  
  .setting-banner.mo-myevent .setting-banner__img {
    flex: auto;
    width: 100%;
    max-width: 328px;
    margin: 0 auto;
  }
  
  .setting-banner.mo-myevent .swiper-container {
    border-radius: 1.7rem;
  }
  
  .setting-banner.mo-card .setting-banner__list > li ~ li {
    margin-top: .8rem;
  }
  
  .setting-banner.mo-card .setting-banner__item {
    border-radius: .8rem;
  }
  
  .setting-banner.mo-card .setting-banner__con {
    padding: 1.7rem 2.6rem;
  }
  
  .setting-banner.mo-card .setting-banner__con .dep {
    font-size: 1.4rem;
  }
  
  .setting-banner.mo-card .setting-banner__con .tit {
    font-size: 1.7rem;
    padding: .8rem 0 1.7rem 0;
  }
  
  .setting-banner.mo-card .setting-banner__con .txt {
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
  }
  
  .setting-banner.mo-card .setting-banner__img img {
    width: 80px;
    height: 80px;
  }
  
  .setting-banner.pop-slip {
    height: 480px;
    overflow-y: scroll;/*높이가 480고정인데 내용이 넘어가면 스크롤 안됨*/
  }
  
  .setting-banner.pop-slip .setting-banner__item {
    flex-direction: column;
    border-radius: 0;
  }
  
  .setting-banner.pop-slip .setting-banner__con {
    flex: none;
    align-items: center;
    padding-bottom: 0;
  }
  
  .setting-banner.pop-slip .setting-banner__img {
    flex: auto;
    width: 100%;
  }
  
  .setting-banner.pop-slip .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    margin: 0 4px;
  }
  
  .setting-banner.pop-slip .swiper-pagination-bullet-active {
    width: 6px;
    height: 6px;
    background: #fc0;
  }
  
  .swiper-slide .setting-banner__item {
    width: 100%;
    height: 100%;
  }
  
  .swiper-slide .setting-banner__img img {
    opacity: 0;
    transition: all 1s;
  }
  
  .swiper-slide .setting-banner__img img.act {
    top: auto;
    max-width: none;
    transform: none;
  }
  
  .swiper-slide .setting-banner__img img.act.rtl {
    transform: translateX(100%);
  }
  
  .swiper-slide .setting-banner__img img.act.ltr {
    transform: translateX(-100%);
  }
  
  .swiper-slide .setting-banner__img img.act.ttb {
    transform: translateY(-100%);
  }
  
  .swiper-slide .setting-banner__img img.act.btt {
    transform: translateY(100%);
  }
  
  .swiper-slide .setting-banner__img img.fix {
    right: auto;
    left: 50%;
    top: 50%;
    max-width: 100%;
    transform: translate(-50%, -50%);
  }
  
  .swiper-slide .setting-banner__img img.fix.rtc {
    transform: translate(100%, -50%);
  }
  
  .swiper-slide .setting-banner__img img.fix.ltc {
    transform: translate(-100%, -50%);
  }
  
  .swiper-slide .setting-banner__img img.fix.ttc {
    transform: translate(-50%, -100%);
  }
  
  .swiper-slide .setting-banner__img img.fix.btc {
    transform: translate(-50%, 100%);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__con .cardname {
    opacity: 1;
    transform: translateX(0);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img {
    opacity: 1;
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.act.rtl {
    transform: translateX(0);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.act.ltr {
    transform: translateX(0);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.act.ttb {
    transform: translateY(0);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.act.btt {
    transform: translateY(0);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.fix.rtc {
    transform: translate(-50%, -50%);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.fix.ltc {
    transform: translate(-50%, -50%);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.fix.ttc {
    transform: translate(-50%, -50%);
  }
  
  .swiper-slide.swiper-slide-active .setting-banner__img img.fix.btc {
    transform: translate(-50%, -50%);
  }
  
  .setting-pop {
    position: fixed;
    top: 0 !important;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    width: 100% !important;
    height: 100%;
  }
  
  .setting-pop * {
    box-sizing: border-box;
  }
  
  .setting-pop__dim {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
  }
  
  .setting-pop__box {
    position: relative;
    display: flex;
    flex-direction: column;
    width: auto;
    height: auto;
    background-color: #fff;
    box-shadow: 0 0 .8rem rgba(0, 0, 0, .16);
  }
  
  .setting-pop__close {
    position: absolute;
    top: 16px;
    right: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border: 0;
    background: none;
    z-index: 100;
  }
  
  .setting-pop__close span {
    position: relative;
    display: block;
    width: 24px;
    height: 24px;
    font-size: 0;
    transform: rotate(45deg);
  }
  
  .setting-pop__close span::before {
    position: absolute;
    top: 50%;
    left: 50%;
    content: "";
    width: 1px;
    height: 100%;
    background-color: #000;
    transform: translate(-50%, -50%);
  }
  
  .setting-pop__close span::after {
    position: absolute;
    top: 50%;
    left: 50%;
    content: "";
    width: 100%;
    height: 1px;
    background-color: #000;
    transform: translate(-50%, -50%);
  }
  
  .setting-pop__tit {
    color: #26282c;
    font-size: 2.1rem;
    font-weight: 600;
    line-height: 1.6;
    padding-bottom: .8rem;
  }
  
  .setting-pop__tit ~ .setting-pop__tit {
    padding-top: 4.3rem;
  }
  
  .setting-pop__con {
    color: #26282c;
    font-size: 1.6rem;
    line-height: 1.6;
    word-break: keep-all;
    padding: 3.4rem 4.3rem;
  }
  
  .setting-pop__con .go {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    font-weight: 600;
    padding-right: 4px;
  }
  
  .setting-pop__con .go::after {
    content: "";
    display: inline-block;
    width: .6rem;
    height: .6rem;
    border-top: 1px solid;
    border-right: 1px solid;
    transform: rotate(45deg);
    vertical-align: middle;
    margin: 0 0 3px 4px;
  }
  
  .setting-pop__con .go:focus {
    outline: -webkit-focus-ring-color auto 5px;
  }
  
  .setting-pop__img {
    width: 100%;
  }
  
  .setting-pop__img a {
    display: block;
    width: 100%;
  }
  
  .setting-pop__img a:focus {
    outline: -webkit-focus-ring-color auto 5px;
  }
  
  .setting-pop__img img {
    max-width: 100%;
  }
  
  .setting-pop__btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 48px;
    color: #26282c;
    font-size: 1.5rem;
    text-align: center;
    padding: .8rem 1.7rem;
    background: none;
    border: 0;
  }
  
  .setting-pop__btn ~ .setting-pop__btn {
    position: relative;
  }
  
  .setting-pop__btn ~ .setting-pop__btn::before {
    position: absolute;
    left: 0;
    top: 50%;
    content: "";
    width: .1rem;
    height: 1.3rem;
    background-color: rgba(0, 0, 0, .16);
    transform: translateY(-50%);
  }
  
  .setting-pop__head {
    flex: none;
    color: #26282c;
    font-size: 1.9rem;
    font-weight: 600;
    line-height: 1.4;
    text-align: left;
    padding: 2.6rem 3.4rem 1.7rem 3.4rem;
  }
  
  .setting-pop__body {
    flex: auto;
    /* height: 100%; */
    overflow: auto;
  }
  
  .setting-pop__foot {
    flex: none;
    display: flex;
    justify-content: center;
    align-items: stretch;
  }
  
  .setting-pop .swiper-button-prev {
    display: flex;
    justify-content: center;
    align-items: center;
    background: none;
  }
  
  .setting-pop .swiper-button-prev::before {
    content: "";
    width: 12px;
    height: 12px;
    border-top: 2px solid #000;
    border-left: 2px solid #000;
    transform: rotate(-45deg);
    margin-left: 6px;
  }
  
  .setting-pop .swiper-button-next {
    display: flex;
    justify-content: center;
    align-items: center;
    background: none;
  }
  
  .setting-pop .swiper-button-next::before {
    content: "";
    width: 12px;
    height: 12px;
    border-top: 2px solid #000;
    border-right: 2px solid #000;
    transform: rotate(45deg);
    margin-right: 6px;
  }
  
  .setting-pop.mo-pop .setting-pop__dim {
    padding: 1.7rem;
  }
  
  .setting-pop.mo-pop .setting-pop__btn {
    flex: auto;
  }
  
  .setting-pop.mo-pop .setting-pop__box {
    width: 100%;
    max-width: 328px;
    max-height: 100%;
    border-radius: 16px;
    overflow: hidden;
  }
  
  .setting-pop.mo-pop .setting-pop__close {
    top: 0;
    right: 0;
  }
  
  .setting-pop.mo-pop .setting-pop__tit {
    font-size: 1.9rem;
  }
  
  .setting-pop.mo-pop .setting-pop__tit ~ .setting-pop__tit {
    padding-top: 3.4rem;
  }
  
  .setting-pop.mo-pop .setting-pop__con {
    font-size: 1.5rem;
    padding: 2.6rem;
  }
  
  .setting-pop.mo-pop .setting-banner__con {
    align-items: center;
    padding: 3.4rem 2.6rem 0;
  }
  
  .setting-pop.mo-pop .setting-banner__con .dep {
    font-size: 1.5rem;
  }
  
  .setting-pop.mo-pop .setting-banner__con .tit {
    font-size: 1.7rem;
    line-height: 1.6;
    padding: .8rem 0 1.7rem 0;
  }
  
  .setting-pop.mo-pop .setting-banner__con .txt {
    font-size: 1.5rem;
  }
  
  .setting-pop.mo-pop .swiper-container {
    border-radius: 16px;
  }
  
  .setting-pop.pc-pop.size-m .setting-pop__box {
    width: 640px;
  }
  
  .setting-pop.pc-pop.size-l .setting-pop__box {
    width: 864px;
  }
  
  .setting-pop.pc-pop .setting-pop__box {
    border-radius: 24px;
    overflow: hidden;
  }
  
  .setting-pop.pc-pop .swiper-container {
    border-radius: 24px;
  }
  
/* 앱통합 작은 사이즈 */
@media screen and (max-height: 470px) {
	.setting-banner.mo-myevent {
		height: 40rem;
	}
	
	.setting-banner.mo-myevent .setting-banner__con {
		padding: 1.6rem;
	}
}

/* 스타클럽 */
.banner-starclub {background: #fef5de url(https://img1.kbcard.com/home_re/mo/img/benefit/img-visual-starclub.png) no-repeat center center; padding: 15.4rem 1.6rem 0 1.6rem; background-size: 18.6rem auto; border-radius: .8rem;}
.ico-grade-level {width:3.2rem; display:inline-block;}
.benefit-starclub .tit-dep1 {color:#26282c;}
.benefit-starclub .list-blt--ico {color:#26282c;}
.benefit-starclub .list-blt--ico li {position:relative; padding:2rem 0 2rem 4.8rem; border-top:1px solid #dde1e4;white-space: normal;}
.benefit-starclub .list-blt--ico li:first-child {border: none}
.benefit-starclub .list-blt--ico li .img {position:absolute; top:50%; left:0; width:3.2rem; height:3.2rem; transform: translateY(-50%);}
.benefit-starclub .list-blt--ico li .img img {width:100%;}
.userinfo-starclub, .userinfo-starclub__notice, .usrgrade {display: flex; flex-wrap: nowrap;}
.userinfo-starclub__notice, .usrgrade {width: 100%;}
.userinfo-starclub {flex-direction: column; align-items: center; margin: 0; padding: 0; overflow: hidden; border-radius: 1.2rem; box-shadow: 0 .1rem .4rem 0 rgba(0, 0, 0, 0.16);}
.userinfo-starclub__notice {position: relative; min-height: 12rem; background: #ffedb0; align-items: flex-end; justify-content: space-between;}
.userinfo-starclub__context {width: calc(100% - 13.6rem); align-self: center; padding: 2rem 0 2rem 1.6rem;}
.userinfo-starclub__context, .userinfo-starclub__context strong {color: #26282c; font-size: 1.4rem; line-height: 1.43; word-break: keep-all;}
.userinfo-starclub__img {width: 13rem; height: auto; position: absolute; right: 0; bottom: -1rem;}
.userinfo-starclub__img img {display: block; width: 100%; height: auto;}
.usrgrade {align-items: center; justify-content: flex-start; background: #fff; padding: 1.6rem;}
.usrgrade__cont {display: flex; align-items: center; color: #26282c; font-size: 1.4rem; font-weight: bold; line-height: 2.4rem;}
.usrgrade__cont + .usrgrade__cont{margin-left: 3.2rem;}
.usrgrade__cont:before {content: ''; display: inline-block; width: 2.4rem; height:2.4rem; margin-right: .6rem;}
.usrgrade__cont--tit:before {background: url('https://img1.kbcard.com/home_re/mo/ico/24/ico-star.png') no-repeat center center / contain;}
.usrgrade__cont--family:before {background: url('https://img1.kbcard.com/home_re/mo/ico/32/ico-grade-f.png') no-repeat center center / contain;}
.usrgrade__cont--best:before {background: url('https://img1.kbcard.com/home_re/mo/ico/32/ico-grade-b.png') no-repeat center center / contain;}
.usrgrade__cont--grand:before {background: url('https://img1.kbcard.com/home_re/mo/ico/32/ico-grade-g.png') no-repeat center center / contain;}
.usrgrade__cont--vip:before {background: url('https://img1.kbcard.com/home_re/mo/ico/32/ico-grade-v.png') no-repeat center center / contain;}
.usrgrade__cont--vvip:before {background: url('https://img1.kbcard.com/home_re/mo/ico/32/ico-grade-vv.png') no-repeat center center / contain;}
@media screen and (max-width: 353px) {
    .userinfo-starclub__context {width: calc(100% - 40.372%);}
    .userinfo-starclub__img {width: 40.372%;}
}

/* 웹접근성 개선 */
.setting-banner.mo-main .swiper-fraction {display: inline-block; position: static; top: auto; right: auto; padding: .4rem .8rem .4rem .9rem; border-radius: 1.2rem; background-color: rgba(0, 0, 0, 0.08); color: #26282c; font-size: 1.2rem; letter-spacing: -.18rem;}
.setting-banner.mo-main .swiper-fraction__active {font-size: 1.2rem; color: #26282c; font-weight: bold; letter-spacing: normal;}
.setting-banner.mo-main .swiper-fraction__total {letter-spacing:normal;}

/* 종합이벤트 상세화면 개선 */
.swiper-dot.mo-main__dot {text-align: left; padding-left: 2.4rem;}
.setting-banner.mo-main .mo-main__dot .swiper-button-control {width: 1.6rem; height: 1.6rem; margin: 0 .4rem 0 0; background: url(https://img1.kbcard.com/home_re/mo/ico/16/ico-pause-02.svg) no-repeat center;}
.setting-banner.mo-main .mo-main__dot .swiper-button-control.play {background-image: url(https://img1.kbcard.com/home_re/mo/ico/16/ico-play-02.svg);}
.setting-banner .mo-main__dot .swiper-pagination {height: 1.6rem;}
.mo-main__dot .swiper-pagination > span {will-change: opacity, transform; margin-bottom: .5rem;}
.mo-main__dot .swiper-pagination > span + span {margin-left: .6rem;}
.mo-main__dot .swiper-pagination-bullet-active {width: 1.2rem !important;}