.main-05,.main-04,.main-03,.main-02 {
    padding-left: max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2))
}

.main-05,.main-04,.main-03,.main-02 {
    padding-right: max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2))
}

@media(max-width: 1024px) {
    .main-01-banner,.modal ul:not([class]) {
        width:100%;
        padding-left: max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2));
        padding-right: max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2))
    }
    .main-01-banner {
    	padding-left: 20px;
    	padding-right: 20px;
    }
}

@media(max-width: 1024px) {
    [role=searchbox] select,.list-city button,.list-search-header,.main-05 ul li,.main-02-01-01,.main-01-swiper-pagination,.main-01-swiper-button-pause {
        min-height:32px
    }
}

@media(min-width: 1025px) {
    [role=searchbox] select:not([aria-invalid=true],:has([aria-invalid=true])):focus,.list-city button:not([aria-invalid=true],:has([aria-invalid=true])):focus,.list-search-header:not([aria-invalid=true],:has([aria-invalid=true])):focus,.main-05 ul li:not([aria-invalid=true],:has([aria-invalid=true])):focus,.main-02-01-01:not([aria-invalid=true],:has([aria-invalid=true])):focus,.main-01-swiper-pagination:not([aria-invalid=true],:has([aria-invalid=true])):focus,.main-01-swiper-button-pause:not([aria-invalid=true],:has([aria-invalid=true])):focus {
        outline:2px solid #9dbff6
    }
}

@media(min-width: 1025px) {
    [role=searchbox] select:is([aria-invalid=true],:has([aria-invalid=true])):focus,.list-city button:is([aria-invalid=true],:has([aria-invalid=true])):focus,.list-search-header:is([aria-invalid=true],:has([aria-invalid=true])):focus,.main-05 ul li:is([aria-invalid=true],:has([aria-invalid=true])):focus,.main-02-01-01:is([aria-invalid=true],:has([aria-invalid=true])):focus,.main-01-swiper-pagination:is([aria-invalid=true],:has([aria-invalid=true])):focus,.main-01-swiper-button-pause:is([aria-invalid=true],:has([aria-invalid=true])):focus {
        outline:2px solid #ef2222
    }
}

.main-05 dl dt,.main-01 .my-box-dl-guide details summary span,.main-01-swiper h2,.main-01 .my-box details summary span,.main-01 .my-box header dl dt,.main-01 .my-box header h2,[role=searchbox] label {
    display: inline-block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important
}

.main-03,.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl,.main-01 .my-box,.main-01 .login-box,.modal ul:not([class]),.main-01 .my-box-dl-guide details summary+p,.main-01 .my-box details summary+p {
    display: flex;
    flex-direction: column
}

.main-03-01-swiper article,.main-03-02-swiper article,.main-03-03-swiper article {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.main-01 {
    display: flex;
    align-items: stretch;
}

.main-01-banner-wrapper span,.main-01 .my-box-dl-guide dt,.main-01-swiper-controls,.main-01 .my-box .card-box,.main-01 .my-box header a,.main-01 .my-box header,.main-05 ul,.list-search-header,.main-01 .my-box-alert,.tooltip {
    display: flex
}

.main-01-banner-wrapper span,.main-01 .my-box-dl-guide dt,.main-01-swiper-controls,.main-01 .my-box .card-box,.main-01 .my-box header a,.main-01 .my-box header,.main-05 ul,.list-search-header,.main-01 .my-box-alert,.tooltip {
    align-items: center
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl div {
    display: flex
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl div {
    justify-content: flex-end
}

.main-05 header,.main-01-banner-wrapper,.main-01 .my-box-calc,.main-01 .my-box-first,.main-01 .my-box-empty,.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert),.main-03-01,.main-03-02,.main-03-03,.main-04,.main-02 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.main-05 header,.main-01-banner-wrapper,.main-01 .my-box-calc,.main-01 .my-box-first,.main-01 .my-box-empty,.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert),.main-03-01,.main-03-02,.main-03-03,.main-04,.main-02 {
    align-items: center
}

.main-03-01-swiper article .img-wrapper,.main-03-02-swiper article .img-wrapper,.main-03-03-swiper article .img-wrapper,.main-01-banner-wrapper a,.list-search-header>button,[role=searchbox],.main-01 .my-box-dl-guide details summary i,.main-01 .my-box details summary i,.main-01 .my-box-alert i,.tooltip i {
    display: flex;
    justify-content: center;
    align-items: center
}

.modal ul:not([class])>li {
    position: relative
}

.modal ul:not([class]) {
    font-size: .875em;
    line-height: 1.5
}

.modal ul:not([class])>li {
    position: relative;
    padding-left: min(0.625em, 2.7777777778vw)
}

.modal ul:not([class])>li::before {
    content: "·";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.5em;
    color: #bababa;
    line-height: 1
}

.main-01 .my-box-dl-guide details summary,.main-01 .my-box details summary,.list-city details summary {
    cursor: pointer;
    list-style: none;
    position: relative;
    outline: none
}

a:has(.main-01 .my-box-dl-guide details summary:active,.main-01 .my-box details summary:active,.list-city details summary:active) {
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

.main-01 .my-box-dl-guide details summary::-webkit-details-marker,.main-01 .my-box details summary::-webkit-details-marker,.list-city details summary::-webkit-details-marker {
    display: none
}

.main-01 .my-box-dl-guide details summary::marker,.main-01 .my-box details summary::marker,.list-city details summary::marker {
    display: none
}

.main-01 .my-box-dl-guide details:not(:focus-within) summary+*,.main-01 .my-box details:not(:focus-within) summary+*,.list-city details:not(:focus-within) summary+* {
    z-index: 1
}

.list-city details[open] summary+* {
    animation: sweep-y .5s forwards ease-in-out
}

.list-city details summary {
    padding-left: .75em;
    padding-right: 1.75em
}

.list-city details summary::after {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background: url("../images/ico/arrow_details.svg?ver=240220") center no-repeat;
    position: absolute;
    top: calc(50% - 0.5em);
    right: .75em
}

.list-city details summary-from {
    padding-left: .75em;
    padding-right: 1.75em
}

@media(min-width: 1025px) {
    .list-city details summary-from::after {
        content:"";
        display: block;
        width: 1em;
        height: 1em;
        background: url("../images/ico/arrow_details.svg?ver=240220") center no-repeat;
        position: absolute;
        top: calc(50% - 0.5em);
        right: .75em
    }
}

datalist {
    overscroll-behavior: none
}

datalist::-webkit-scrollbar {
    border-radius: 4px;
    background-color: rgba(48,57,90,.15)
}

datalist::-webkit-scrollbar-track {
    border-left: 1px solid rgba(0,0,0,0);
    border-radius: 4px;
    background-color: rgba(0,0,0,0);
    background-clip: content-box
}

datalist::-webkit-scrollbar-thumb {
    border: 1px solid rgba(0,0,0,0);
    border-left: 1px solid rgba(0,0,0,0);
    border-radius: 4px;
    background-color: #fc5b00;
    background-clip: content-box
}

datalist::-webkit-scrollbar-button {
    width: 0;
    height: 0
}

datalist {
    overflow-y: auto;
    overflow-x: hidden
}

datalist::-webkit-scrollbar {
    margin-left: 6px;
    width: 8px
}

.main-01 .my-box-calc::after,.main-01 .my-box-first::after,.main-01 .my-box-empty::after,.main-01 .my-box header a::after,.main-01-banner-wrapper a::after,.main-02-01-01::after {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain
}

.main-04-01 button {
    font-family: "Pretendard",sans-serif;
    font-weight: 400
}

.main-05 dl dd,.main-01-banner-wrapper a,.main-01-banner-wrapper span,.main-01 .my-box-calc p strong,.main-01 .my-box-first p strong,.main-01 .my-box .card-box figcaption,.main-01 .my-box h4,.main-01 .my-box h3,.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl dt,.main-01 .my-box-alert,.tooltip,.main-01 .my-box-calc p,.main-01 .my-box-first p,.main-01 .my-box-empty p,.main-03 header h3+p,.main-03 h2+p,.main-04 h2+p,.main-02 h2+p,.main-05 ul li,.main-02-01-01,.main-01-swiper-pagination,.main-01-swiper-button-pause,.main-01 .my-box-dl-guide details summary+p,.main-01 .my-box details summary+p {
    font-family: "Pretendard",sans-serif;
    font-weight: 500
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl dd,.main-01 .my-box header a,.main-03 header h3,.main-05 h2,.main-03 h2,.main-04 h2,.main-02 h2 {
    font-family: "Pretendard",sans-serif;
    font-weight: 700
}

[hidden][role=tabpanel] {
    opacity: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: -1 !important
}

[hidden][role=tabpanel] {
    width: 0 !important;
    height: 0 !important;
    flex: none !important
}

[role=searchbox] select[disabled],.main-04-01 button[disabled],.list-city button[disabled],[disabled].list-search-header,.main-05 ul li[disabled],[disabled].main-02-01-01,[disabled].main-01-swiper-pagination,[disabled].main-01-swiper-button-pause {
    cursor: unset;
    pointer-events: none;
    opacity: .5
}

.main-01 .my-box-dl-guide details summary+p,.main-01 .my-box details summary+p {
    justify-content: flex-end;
    font-size: .875em;
    padding: 1.1428571429em;
    line-height: 1.2;
    width: 100%;
    border: solid 1px #888;
    border-radius: .5714285714em;
    position: absolute;
    background-color: #fff;
    box-shadow: 2px 4px 16px 0 rgba(0,0,0,.1);
    top: 2.8571428571em;
    left: 0;
    z-index: 1
}

@keyframes bgLine {
    50% {
        opacity: 1
    }

    100% {
        background-position-x: 0;
        opacity: 1
    }
}

.main-01-banner-wrapper {
    overflow: hidden;
}

@keyframes appear {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes disappear {
    0% {
        opacity: 1
    }

    99% {
        opacity: 0
    }

    100% {
        opacity: 0;
        visibility: hidden;
        display: none;
        z-index: -1;
        width: 0;
        height: 0
    }
}

@keyframes sweep {
    0% {
        opacity: 0;
        transform: translateX(-1.875em)
    }

    100% {
        opacity: 1;
        transform: translateX(0px)
    }
}

@keyframes sweep-reverse {
    0% {
        opacity: 0;
        transform: translateX(1.875em)
    }

    100% {
        opacity: 1;
        transform: translateX(0px)
    }
}

@keyframes sweep-y {
    0% {
        opacity: 0;
        transform: translateY(-1.875em)
    }

    100% {
        opacity: 1;
        transform: translateY(0px)
    }
}

@keyframes sweep-y-reverse {
    0% {
        opacity: 0;
        transform: translateY(1.875em)
    }

    100% {
        opacity: 1;
        transform: translateY(0px)
    }
}

@keyframes sweep-disappear {
    0% {
        transform: translateY(0px)
    }

    100% {
        opacity: 0;
        transform: translateX(-1.875em)
    }
}

@keyframes sweep-disappear-container {
    0% {
        transform: translateY(0px)
    }

    50% {
        opacity: 0;
        transform: translateX(-1.875em)
    }

    100% {
        opacity: 0;
        transform: translateX(-1.875em);
        position: absolute;
        width: 0;
        height: 0;
        overflow: hidden
    }
}

@keyframes sweep-y-disappear {
    0% {
        transform: translateY(0px)
    }

    100% {
        opacity: 0;
        transform: translateY(1.875em)
    }
}

@keyframes vibration {
    from {
        transform: translateX(-1px) rotate(1deg)
    }

    to {
        transform: translateX(1px) rotate(-1deg) scale(1.05)
    }
}

@keyframes sweep-y-opacity {
    0% {
        position: absolute;
        opacity: 0;
        transform: translateY(1.875em)
    }

    2% {
        position: relative;
        opacity: 1;
        transform: translateY(0px);
        height: auto
    }

    18% {
        position: relative;
        opacity: 1;
        transform: translateY(0px);
        height: auto
    }

    20% {
        position: relative;
        opacity: 0;
        transform: translateY(-1.875em);
        height: auto
    }

    22% {
        position: absolute
    }

    100% {
        opacity: 0;
        position: absolute;
        z-index: -1;
        height: 0
    }
}

@keyframes sweep-infinite {
    0% {
        opacity: 0;
        transform: translateX(-0.9375em)
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0;
        transform: translateX(0.9375em)
    }
}

@keyframes sweep-y-infinite {
    0% {
        opacity: 0;
        transform: translateY(-0.9375em) rotate(90deg)
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0;
        transform: translateY(0.9375em) rotate(90deg)
    }
}

@keyframes marquee {
    from {
        transform: translateX(0%)
    }

    to {
        transform: translateX(-100%)
    }
}

@keyframes marquee-reverse {
    from {
        transform: translateX(-100%)
    }

    to {
        transform: translateX(0%)
    }
}

@keyframes jelly-5s {
    0% {
        transform: scale(0.9, 1.1)
    }

    2% {
        transform: scale(1.1, 0.9)
    }

    4% {
        transform: scale(0.95, 1.05)
    }

    6% {
        transform: scale(1)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes bounce {
    50% {
        transform: scale(1.2)
    }

    75% {
        transform: scale(0.9)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes hidden {
    0% {
        visibility: visible
    }

    100% {
        visibility: hidden
    }
}

@keyframes visibility {
    0% {
        visibility: hidden
    }

    100% {
        visibility: visible
    }
}

@keyframes loading-active {
    0% {
        background-image: url("../images/ico/loading.svg?ver=240220")
    }

    50% {
        background-image: url("../images/ico/loading_active.svg?ver=240220")
    }

    100% {
        background-image: url("../images/ico/loading.svg?ver=240220")
    }
}

.list-city button,.list-search-header,.main-05 ul li,.main-02-01-01,.main-01-swiper-pagination,.main-01-swiper-button-pause {
    cursor: pointer;
    display: inline-flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    position: relative;
    word-break: keep-all;
    line-height: 1.2;
    max-width: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0) !important;
    overflow: hidden
}

.list-city button i,.list-search-header i,.main-05 ul li i,.main-02-01-01 i,.main-01-swiper-pagination i,.main-01-swiper-button-pause i {
    font-style: normal
}

.list-city button[hidden],[hidden].list-search-header,.main-05 ul li[hidden],[hidden].main-02-01-01,[hidden].main-01-swiper-pagination,[hidden].main-01-swiper-button-pause {
    display: none
}

body.fixed {
    overflow: hidden
}

[role=searchbox] select {
    width: 100%;
    color: #222;
    background: #fff;
    border: 1px solid #dcdcdc;
    border-radius: .5em
}

@media(min-width: 1025px) {
    [role=searchbox] select {
        font-size:max(14px,min(1em, 4.4444444444vw));
        height: 3.25em
    }
}

@media(max-width: 1024px) {
    [role=searchbox] select {
        font-size:max(14px,min(1em, 4.4444444444vw));
        height: 3.25em
    }
}

[role=searchbox] select[aria-invalid=true] {
    border-color: #ef2222
}

[role=searchbox] select[disabled] {
    background-color: #eee
}

[role=searchbox] select {
    padding: 0 min(2.75em, 44px) 0 min(1em, 16px);
    background: url("../images/ico/arrow_select.svg?ver=240220") right min(1em, 16px) center no-repeat #fff;
    background-size: min(0.75em, 12px) min(0.625em, 10px)
}

.list-city button,.list-search-header,.main-05 ul li,.main-02-01-01,.main-01-swiper-pagination,.main-01-swiper-button-pause {
    cursor: pointer;
    display: inline-flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    position: relative;
    word-break: keep-all;
    line-height: 1.2;
    max-width: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0) !important;
    overflow: hidden
}

.list-city button i,.list-search-header i,.main-05 ul li i,.main-02-01-01 i,.main-01-swiper-pagination i,.main-01-swiper-button-pause i {
    font-style: normal
}

.list-city button[hidden],[hidden].list-search-header,.main-05 ul li[hidden],[hidden].main-02-01-01,[hidden].main-01-swiper-pagination,[hidden].main-01-swiper-button-pause {
    display: none
}

.main-01 .my-box-dl-guide details summary i::before,.main-01 .my-box details summary i::before,.main-01 .my-box-alert i::before,.tooltip i::before {
    content: "";
    font-size: 1.6rem;
    width: 1em;
    height: 1em;
    background: url("../images/ico/alert_gray.svg?ver=240220") center no-repeat;
    background-size: 100%
}

.main-01-swiper-pagination,.main-01-swiper-button-pause {
    font-size: 14px;
    height: 23px;
    border-radius: .875em;
    padding-left: .5625em;
    padding-right: .5625em;
    gap: .125em;
    min-height: auto
}

.main-05 ul li,.main-02-01-01 {
    font-size: .875em;
    min-height: 2.4285714286em;
    padding-left: min(1.1428571429em, 4.4444444444vw);
    padding-right: min(1.1428571429em, 4.4444444444vw);
    gap: .1428571429em
}

.main-02-01-01 {
    padding-right: .5714285714em;
    font-size: 18px;
    font-weight: 700;
    border: 1px solid #9e9e9e;
    border-radius: 12px;
    height: 56px;
    letter-spacing: -0.5px;
}

.main-02-01-01::after {
    content: "";
    min-width: min(1em, 4.4444444444vw);
    height: min(1em, 4.4444444444vw);
    background-image: url("../images/ico/arrow_more.svg?ver=240220")
}

@media(min-width: 1025px) {
    .main-05 h2,.main-03 h2,.main-04 h2,.main-02 h2 {
        font-size:2em
    }
}

@media(max-width: 1024px) {
    .main-05 h2,.main-03 h2,.main-04 h2,.main-02 h2 {
        font-size:1.25em
    }
}

@media(min-width: 1025px) {
    .main-05 h2:has(+p),.main-03 h2:has(+p),.main-04 h2:has(+p) {
        margin-bottom:.625em
    }
    .main-02 h2:has(+p) {
    	line-height: 1.4;
    	margin:24px 0 12px;
    	letter-spacing: -0.5px;
    }
}

@media(max-width: 1024px) {
    .main-05 h2:has(+p),.main-03 h2:has(+p),.main-04 h2:has(+p),.main-02 h2:has(+p) {
        margin-bottom:1em
    }
}

.main-03 header h3 {
    line-height: 1.4;
    letter-spacing: -0.075em
}

@media(min-width: 1025px) {
    .main-03 header h3 {
        font-size:1.5em
    }
}

@media(max-width: 1024px) {
    .main-03 header h3 {
        font-size:1em
    }
}

@media(min-width: 1025px) {
    .main-03 header h3:has(+p) {
        margin-bottom:.3333333333em
    }
}

@media(max-width: 1024px) {
    .main-03 header h3:has(+p) {
        margin-bottom:.5em
    }
}

@media(min-width: 1025px) {
    .sub header:has(>:is(h2,h3,h4,h5)) {
        margin-bottom:2em
    }
}

@media(max-width: 1024px) {
    .sub header:has(>:is(h2,h3,h4,h5)) {
        margin-bottom:.75em
    }
}

@media(max-width: 1024px) {
    body:has(#header[aria-expanded=true]) .header-sub h2 {
        opacity:0
    }
}

.main-03 h2+p,.main-04 h2+p {
    color: #888
}
.main-02 p:first-child {
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.5px;
}
.main-02 h2+p {
	color: #666;
	font-size: 16px;
	font-weight: 400;
}
.main-03 h2+p:has(+a),.main-04 h2+p:has(+a),.main-02 h2+p:has(+a) {
    margin-bottom: 2em
}

.main-03 h2+p:has(+div),.main-04 h2+p:has(+div),.main-02 h2+p:has(+div) {
    margin-bottom: 3.75em
}

.main-03 header h3+p {
    color: #888
}

@media(min-width: 1025px) {
    .main-03 header h3+p {
        font-size:1.25em
    }
}

@media(max-width: 1024px) {
    .main-03 header h3+p {
        font-size:.875em
    }
}

.main-01 .my-box-calc p,.main-01 .my-box-first p,.main-01 .my-box-empty p {
    font-size: .875em
}

.main-01 .my-box-calc p,.main-01 .my-box-first p,.main-01 .my-box-empty p {
    color: #888;
    line-height: 1.4
}

.main-01 .my-box-alert strong,.tooltip strong {
    text-decoration: underline
}

.main-01 .my-box-alert,.tooltip {
    gap: .5714285714em
}

.main-01 .my-box-alert,.tooltip {
    font-size: .875em;
    color: #666
}

.main-01 .my-box-alert:not(:last-child) {
    margin-bottom: 1.4285714286em
}

.tooltip {
    width: 100%
}

[role=searchbox] {
    position: relative
}

.main-04-01 button,[role=searchbox] input {
    width: 100%;
    height: 3.75em;
    border-radius: 1em;
    transition: .2s ease-in-out
}

.main-04-01 button {
    padding-left: 1em;
    padding-right: 1em;
    border: 2px solid #002147;
    box-shadow: 3px 3px 6px 0 rgba(0,0,0,.1);
    background-color: #fff;
    outline-color: #002147
}

.main-04-01 button+:is(button,a) {
    z-index: 1;
    opacity: 1
}

[role=searchbox] button,[role=searchbox] a {
    width: 1.75em;
    height: 1.75em;
    background: url("../images/ico/search.svg?ver=240220") center no-repeat;
    background-size: contain;
    color: rgba(0,0,0,0);
    position: absolute;
    top: calc(50% - 0.875em);
    right: .75em;
    opacity: 0;
    z-index: -1;
    transition: .2s ease-in-out
}

.list-search-header {
    gap: 1.5em;
    margin-bottom: min(2em, 8.8888888889vw)
}

.list-search-header>button::before {
    content: "";
    width: .625em;
    min-width: .625em;
    height: .625em;
    background: url("../images/ico/arrow_details.svg?ver=240220") center no-repeat;
    background-size: 100%;
    transform: rotate(180deg)
}

[role=tabpanel]:not([hidden]) {
    animation: sweep-y .2s ease-in-out forwards
}

[role=tablist] {
    overflow: visible
}

.list-city li button {
    width: 100%
}

@media(min-width: 1025px) {
    .list-city {
        display:flex;
        flex-wrap: wrap;
        gap: .75em
    }
}

@media(min-width: 1025px) {
    .list-city li {
        width:calc((100% - .75em)/2)
    }
}

.list-city li button {
    font-size: 1em
}

@media(min-width: 1025px) {
    .list-city li button {
        height:3.25em
    }
}

.list-city li:has([aria-selected=true]) button {
    border-color: #fc5b00
}

@media(max-width: 1024px) {
    .list-city li button {
        font-size:1em;
        height: 3.75em;
        justify-content: space-between;
        text-align: left;
        border: none
    }
}

.list-city li:has([aria-selected=true]) button {
    color: #fc5b00
}

@media(max-width: 1024px) {
    .list-city li:has([aria-selected=true]) button::after {
        content:"";
        width: 1.5em;
        height: 1.5em;
        background: url("../images/ico/chk_orange.svg?ver=240220") center no-repeat;
        background-size: 100%
    }
}

.main-05 ul {
    flex-wrap: wrap;
    gap: .75em
}

.main-05 ul li {
    color: #888;
    background-color: #f8f8f8
}

datalist option {
    cursor: pointer;
    z-index: 1
}

datalist option {
    font-size: min(1em, 4.4444444444vw);
    background-color: #fff;
    width: 100%;
    height: 2.5em;
    line-height: 2.5em;
    padding-left: 1em;
    padding-right: 1em;
    opacity: 1;
    display: block;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none
}

.modal ul:not([class]) {
    gap: .625em;
    word-break: keep-all
}

.modal ul:not([class]) li {
    line-height: 1.4
}

datalist {
    position: absolute;
    max-height: min(22.5em,50vh);
    border: 0 none;
    overflow-x: hidden;
    overflow-y: auto;
    width: 100%;
    left: 0;
    display: none;
    background-color: #fff;
    border: 1px solid #dcdcdc;
    border-top: none;
    border-bottom-left-radius: .5em;
    border-bottom-right-radius: .5em;
    padding-top: .5em;
    margin-top: -0.5em
}

datalist option:is(:focus-within,:hover) {
    background-color: #f8f8f8;
    outline: 0 none
}

datalist option span {
    color: #888
}

li:has(datalist):not(:focus-within) datalist {
    z-index: -1;
    opacity: 0
}

input:has(~datalist)::-webkit-list-button {
    -webkit-appearance: none;
    appearance: none;
    display: none !important
}

.modal ul:not([class]) {
    padding-bottom: .75em
}

@media(min-width: 1025px) {
    .modal ul:not([class]) {
        padding-left:1.25em;
        padding-right: 1.25em
    }
}

.main {
    --swiper-theme-color: #e5e5e5
}

.main-03-01,.main-03-02,.main-03-03 {
    --swiper-theme-color: #e5e5e5;
    background-color: #fff;
    box-shadow: 0 .25em .5em 0 rgba(0,0,0,.06);
    border-radius: 1em
}

@media(min-width: 1025px) {
    .main-03-01,.main-03-02,.main-03-03 {
        --swiper-navigation-size:2.0625em;
        padding: min(3em, 13.3333333333vw) min(3.75em, 16.6666666667vw)
    }
}

@media(max-width: 1024px) {
    .main-03-01,.main-03-02,.main-03-03 {
        --swiper-navigation-size:1.5em;
        padding: min(2em, 8.8888888889vw) min(1.125em, 5vw);
        gap: min(1.5em, 6.6666666667vw)
    }
}

@media(min-width: 1025px) {
    .main-03 header {
        min-width:20em
    }
}

@media(max-width: 1024px) {
    .main-03 header {
        width:100%;
        text-align: center
    }
}

.main-01 {
    gap: 1.5em;
    position: relative;
    /*한시적 적용 추가*/
    padding-bottom: 1.5em;
}

.main-01 .my-box,.main-01 .login-box {
    flex: 1;
}

@media(min-width: 1025px) {
    .main-01 .my-box,.main-01 .login-box {
        border:1px solid #b5b5b5;
        padding: 1.75em;
        border-radius: 1.75em;
        min-height: 37.5em
    }
}

@media(max-width: 1024px) {
    .main-01 .my-box,.main-01 .login-box {
        padding-left:max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2));
        padding-right: max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2))
    }
}

@media(max-width: 1024px) {
    .main-01 .my-box {
        width: 100%;
        padding-bottom: 2.5em
    }
}

.main-01 .my-box>header {
    justify-content: space-between
}

.main-01 .my-box header {
    position: relative;
    width: 100%
}

.main-01 .my-box header a {
    font-size: 14px;
    gap: .3333333333em;
    font-weight: 500;
    padding-left: 40px;
    height: 32px;
    background: url('../images/ico/ico-my-main.svg') 0 50% no-repeat;
    background-size: 32px;
}

.main-01 .my-box header a::after {
    content: "";
    width: 16px;
    height: 16px;
    background-image: url("../images/ico/arrow_more.svg?ver=240220");
}

.main-01 .my-box header dl {
    max-width: 40%
}

.main-01 .my-box .local-label {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
}

.main-01 .my-box header dl dd img {
    max-height: 100%;
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) {
    padding-top: 1em;
    padding-bottom: .625em
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl {
    flex: 1;
    min-width: 6.875em
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl div {
    align-items: center;
    gap: .5em
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl dt {
    color: #888
}

@media(max-width: 1024px) {
    .main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl dt {
        font-size:.875em
    }
}

@media(min-width: 1025px) {
    .main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl dd {
        font-size:1.25em
    }
}

.main-01 .my-box header:has(h3) {
    margin-bottom: .625em;
    gap: .4375em
}

.main-01 .my-box h3 {
    position: relative
}

@media(min-width: 1025px) {
    .main-01 .my-box h3 {
        font-size:1.25em
    }
}

@media(max-width: 1024px) {
    .main-01 .my-box h3 {
        font-size:.875em
    }
}

.main-01 .my-box h4 {
    font-size: .875em
}

.main-01 .my-box .card-box {
    gap: .75em;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

@media(min-width: 1025px) {
    .main-01 .my-box .card-box {
        flex-direction:column;
        width: 6.875em
    }
}

@media(min-width: 1025px) {
    .main-01 .my-box .card-box img {
        width:3.125em
    }
}

@media(max-width: 1024px) {
    .main-01 .my-box .card-box img {
        width:2em
    }
}

.main-01 .my-box .card-box .card-name {
    font-size: .875em;
    white-space: nowrap;
    text-align: center;
    font-weight: 500;
    color: #222;
}

@media(min-width: 1025px) {
    .main-01 {
        padding-top:1.75em;
        padding-left: max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2));
        padding-right: max(min(4.4444444444vw, 2.5em), calc((100vw - (1200px)) / 2));
        flex-wrap: wrap;
        /*한시적 적용 추가*/
        padding-bottom: 1.75em;
    }
}

@media(max-width: 1024px) {
    .main-01 {
        flex-direction:column
    }
}

.main-01-swiper {
    position: relative;
    overflow: hidden
}

@media(min-width: 1025px) {
    .main-01-swiper {
        max-width:min(50em,100% - min(20em, 88.8888888889vw));
        flex: 4;
    }
}

@media(max-width: 1024px) {
    .main-01-swiper {
        max-width:100%;
        max-height: calc(100dvh - min(3.5em, 15.5555555556vw));
    }
}

@media(max-width: 768px) {
	.main-01-swiper {margin: 0 20px;}
}

.main-01-swiper-button-next {
    position: absolute
}

.main-01-swiper-button-pause {
    color: rgba(0,0,0,0);
    width: 2.125em;
    overflow: hidden;
    background: url("../images/ico/pause_white.svg?ver=240220") center no-repeat rgba(24,29,54,.2);
    background-size: auto 45%
}

.main-01-swiper-pagination {
    position: relative;
    color: #fff;
    background-color: rgba(24,29,54,.2)
}


@media(min-width: 769px) {
	.main-01-swiper-pagination,.main-01-swiper-button-pause {
		height: 27px;
	}
	.main-01-swiper-button-pause {
		width: 37px;
	}
}

.main-01-swiper-controls {
    position: absolute;
    bottom: 12px;
    left: 28px;
    z-index: 1;
    gap: .375em
}

@media(min-width: 769px) {
	.main-01-swiper-controls {
		left: 40px;
		bottom: 40px;
	}
	.swiper-slide :is(a,picture,img):not([width]) {
		height: 100%;
	}
    .main-01-swiper picture {
        border-radius:1.75em;
    }
}

@media(min-width: 769px) {
    .main-01-swiper img {
        width:calc(100% - 40px);
        height: 100%;
        object-fit: fill;
        margin: 0 20px;
        border-radius: 28px;
    }
    .main-01-swiper img.border {
    	border: 1px solid #969696;
    }
}

@media(min-width: 1025px) {
	.main-01-swiper img {
        margin: 0;
        width: 100%;
    }
}

@media(max-width: 768px) {
    .main-01-banner {
    	padding-right: 20px;
    	padding-left: 20px;
    }
    .main-01-swiper img {
        width:100%;
        max-height: calc(100dvh - min(3.5em, 15.5555555556vw));
        overflow: hidden;
        border-radius: 24px;
    }
}

.main-01:has(.my-box) {
    padding-bottom: 1.75em
}

@media(max-width: 1024px) {
    .main-01:has(.my-box) {
        border-bottom:.5em solid #ececec
    }
}

@media(max-width: 1024px) {
    .main-01 .login-box {
        display:none
    }
}

.main-01 .my-box {
    justify-content: space-between
}

.main-01 .my-box hr {
    height: 1px;
    background-color: #f0f0f0
}

.main-01 .my-box-dl {
    position: relative;
    width: 100%;
    gap: .625em
}

@media(min-width: 1025px) {
    .main-01 .my-box-dl:last-of-type {
        order:2
    }
}

.main-01 .my-box-dl-guide dt {
    gap: .25em
}

.main-01 .my-box-dl-guide details {
    order: -1
}

.main-01 .my-box-dl-guide details summary+p {
    color: #222;
    width: auto
}

@media(min-width: 1025px) {
    .main-01 .my-box-dl-guide details summary+p {
        top:9.6875em
    }
}

@media(max-width: 1024px) {
    .main-01 .my-box-dl-guide details summary+p {
        top:10.625em
    }
}

.main-01 .my-box-empty {
    width: 100%
}

.main-01 .my-box-empty::after {
    content: "";
    width: 3em;
    height: 3em;
    background-image: url("../images/common/pay_reject.webp?ver=240220");
    max-width: 25%
}

.main-01 .my-box-first {
    flex-wrap: nowrap;
    width: 100%;
    word-break: keep-all
}

.main-01 .my-box-first p strong {
    color: #222
}

.main-01 .my-box-first::after {
    content: "";
    width: 6.125em;
    height: 6.125em;
    background-image: url("../images/common/pay_gift.webp?ver=240220");
    max-width: 30%
}

.main-01 .my-box-calc {
    flex-wrap: nowrap;
    width: 100%;
    word-break: keep-all
}

.main-01 .my-box-calc p strong {
    color: #222
}

.main-01 .my-box-calc::after {
    content: "";
    width: 4.125em;
    height: 4.3125em;
    background-image: url("../images/common/pay_calc.webp?ver=240220");
    max-width: 30%
}

.main-01 .my-box .group-btn--center a {
    flex: 1;
    min-width: auto
}

@media(min-width: 1025px) {
    .main-01-banner {
        order:99;
        width: 100%
    }
}

.main-01-banner-wrapper span {
    gap: .3em
}

.main-01-banner-wrapper a {
    font-size: .875em;
    gap: .3em
}

.main-02 {
    content-visibility: auto
}

@media(min-width: 1025px) {
    .main-02 {
        padding-top:min(2.5em, 11.1111111111vw);
        padding-bottom: min(5em, 22.2222222222vw)
    }
}

@media(max-width: 1024px) {
    .main-02 p {
        width:calc(100% - 8.375em)
    }
}

@media(max-width: 1024px) {
    .main-02 img {
        margin-left:auto;
        width: 7.75em;
        margin-top: -40%
    }
}

.main-03 {
    content-visibility: auto;
    padding-top: 5em;
    padding-bottom: 5em;
    gap: 1.25em;
    background-color: #f5f8f9
}

.main-03-01-swiper,.main-03-02-swiper,.main-03-03-swiper {
    position: relative;
    flex: 1;
    overflow: hidden
}

.main-03-01-swiper::after,.main-03-02-swiper::after,.main-03-03-swiper::after,.main-03-01-swiper::before,.main-03-02-swiper::before,.main-03-03-swiper::before {
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    background-color: #fff;
    z-index: 2
}

@media(min-width: 1025px) {
    .main-03-01-swiper::after,.main-03-02-swiper::after,.main-03-03-swiper::after,.main-03-01-swiper::before,.main-03-02-swiper::before,.main-03-03-swiper::before {
        width:3.25em
    }
}

@media(max-width: 1024px) {
    .main-03-01-swiper::after,.main-03-02-swiper::after,.main-03-03-swiper::after,.main-03-01-swiper::before,.main-03-02-swiper::before,.main-03-03-swiper::before {
        width:2.25em
    }
}

@media(min-width: 1025px) {
    .main-03-01-swiper,.main-03-02-swiper,.main-03-03-swiper {
        padding:0 3.25em;
        max-width: 48em
    }
}

@media(max-width: 1024px) {
    .main-03-01-swiper,.main-03-02-swiper,.main-03-03-swiper {
        padding:0 2.25em
    }
}

.main-03-01-swiper-button-prev,.main-03-01-swiper-button-next,.main-03-02-swiper-button-prev,.main-03-02-swiper-button-next,.main-03-03-swiper-button-prev,.main-03-03-swiper-button-next {
    margin-top: -1.625em
}

.main-03-01-swiper-button-prev::after,.main-03-01-swiper-button-next::after,.main-03-02-swiper-button-prev::after,.main-03-02-swiper-button-next::after,.main-03-03-swiper-button-prev::after,.main-03-03-swiper-button-next::after {
    font-weight: bold;
    font-size: 1.125em;
    color: #888
}

.main-03-01-swiper::before,.main-03-02-swiper::before,.main-03-03-swiper::before {
    left: 0
}

.main-03-01-swiper::after,.main-03-02-swiper::after,.main-03-03-swiper::after {
    right: 0
}

.main-03-01-swiper article,.main-03-02-swiper article,.main-03-03-swiper article {
    margin-left: auto;
    margin-right: auto;
    position: relative
}

.main-03-01-swiper article .img-wrapper,.main-03-02-swiper article .img-wrapper,.main-03-03-swiper article .img-wrapper {
    background-color: #e7f2f1;
    border-radius: 50%;
    margin-bottom: 1em
}

@media(min-width: 1025px) {
    .main-03-01-swiper article .img-wrapper,.main-03-02-swiper article .img-wrapper,.main-03-03-swiper article .img-wrapper {
        width:12.5em;
        height: 12.5em;
        max-width: 12.5em;
        max-height: 12.5em;
        padding: 2.5em
    }
}

@media(max-width: 1024px) {
    .main-03-01-swiper article .img-wrapper,.main-03-02-swiper article .img-wrapper,.main-03-03-swiper article .img-wrapper {
        width:6.25em;
        height: 6.25em;
        max-width: 6.25em;
        max-height: 6.25em;
        padding: 1.375em
    }
}

.main-03-01-swiper article h4,.main-03-02-swiper article h4,.main-03-03-swiper article h4 {
    width: 100%;
    text-align: center;
    order: 2
}

.main-03-01-swiper article.HANA .img-wrapper,.main-03-02-swiper article.HANA .img-wrapper,.main-03-03-swiper article.HANA .img-wrapper {
    background-color: rgba(154,217,210,.3)
}

.main-03-01-swiper article.HANA .img-wrapper::before,.main-03-02-swiper article.HANA .img-wrapper::before,.main-03-03-swiper article.HANA .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/hana.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.BR .img-wrapper,.main-03-02-swiper article.BR .img-wrapper,.main-03-03-swiper article.BR .img-wrapper {
    background-color: rgba(255,182,196,.3)
}

.main-03-01-swiper article.BR .img-wrapper::before,.main-03-02-swiper article.BR .img-wrapper::before,.main-03-03-swiper article.BR .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/br.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.IBK .img-wrapper,.main-03-02-swiper article.IBK .img-wrapper,.main-03-03-swiper article.IBK .img-wrapper {
    background-color: rgba(186,200,254,.3)
}

.main-03-01-swiper article.IBK .img-wrapper::before,.main-03-02-swiper article.IBK .img-wrapper::before,.main-03-03-swiper article.IBK .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/ibk.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.SH .img-wrapper,.main-03-02-swiper article.SH .img-wrapper,.main-03-03-swiper article.SH .img-wrapper {
    background-color: rgba(172,207,255,.3)
}

.main-03-01-swiper article.SH .img-wrapper::before,.main-03-02-swiper article.SH .img-wrapper::before,.main-03-03-swiper article.SH .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/sh.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.WR .img-wrapper,.main-03-02-swiper article.WR .img-wrapper,.main-03-03-swiper article.WR .img-wrapper {
    background-color: rgba(144,213,255,.3)
}

.main-03-01-swiper article.WR .img-wrapper::before,.main-03-02-swiper article.WR .img-wrapper::before,.main-03-03-swiper article.WR .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/wr.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.WB .img-wrapper,.main-03-02-swiper article.WB .img-wrapper,.main-03-03-swiper article.WB .img-wrapper {
    background-color: rgba(248,233,238,.3)
}

.main-03-01-swiper article.WB .img-wrapper::before,.main-03-02-swiper article.WB .img-wrapper::before,.main-03-03-swiper article.WB .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/wb.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.SS .img-wrapper,.main-03-02-swiper article.SS .img-wrapper,.main-03-03-swiper article.SS .img-wrapper {
    background-color: rgba(164,206,255,.3)
}

.main-03-01-swiper article.SS .img-wrapper::before,.main-03-02-swiper article.SS .img-wrapper::before,.main-03-03-swiper article.SS .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/ss.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.KB .img-wrapper,.main-03-02-swiper article.KB .img-wrapper,.main-03-03-swiper article.KB .img-wrapper {
    background-color: rgba(255,228,175,.3)
}

.main-03-01-swiper article.KB .img-wrapper::before,.main-03-02-swiper article.KB .img-wrapper::before,.main-03-03-swiper article.KB .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/kb.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.NH .img-wrapper,.main-03-02-swiper article.NH .img-wrapper,.main-03-03-swiper article.NH .img-wrapper {
    background-color: rgba(168,228,169,.3)
}

.main-03-01-swiper article.NH .img-wrapper::before,.main-03-02-swiper article.NH .img-wrapper::before,.main-03-03-swiper article.NH .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/nh.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.KBK .img-wrapper,.main-03-02-swiper article.KBK .img-wrapper,.main-03-03-swiper article.KBK .img-wrapper {
    background-color: rgba(218,212,252,.3)
}

.main-03-01-swiper article.KBK .img-wrapper::before,.main-03-02-swiper article.KBK .img-wrapper::before,.main-03-03-swiper article.KBK .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/kbk.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.GJ .img-wrapper,.main-03-02-swiper article.GJ .img-wrapper,.main-03-03-swiper article.GJ .img-wrapper {
    background-color: rgba(204,224,255,.3)
}

.main-03-01-swiper article.GJ .img-wrapper::before,.main-03-02-swiper article.GJ .img-wrapper::before,.main-03-03-swiper article.GJ .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/gj.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.HD .img-wrapper,.main-03-02-swiper article.HD .img-wrapper,.main-03-03-swiper article.HD .img-wrapper {
    background-color: rgba(219,219,219,.3)
}

.main-03-01-swiper article.HD .img-wrapper::before,.main-03-02-swiper article.HD .img-wrapper::before,.main-03-03-swiper article.HD .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/hd.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.TM .img-wrapper,.main-03-02-swiper article.TM .img-wrapper,.main-03-03-swiper article.TM .img-wrapper {
    background-color: rgba(255,208,250,.3)
}

.main-03-01-swiper article.TM .img-wrapper::before,.main-03-02-swiper article.TM .img-wrapper::before,.main-03-03-swiper article.TM .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/tm.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.DG .img-wrapper,.main-03-02-swiper article.DG .img-wrapper,.main-03-03-swiper article.DG .img-wrapper {
    background-color: rgba(161,239,211,.3)
}

.main-03-01-swiper article.DG .img-wrapper::before,.main-03-02-swiper article.DG .img-wrapper::before,.main-03-03-swiper article.DG .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/dg.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.EB .img-wrapper,.main-03-02-swiper article.EB .img-wrapper,.main-03-03-swiper article.EB .img-wrapper {
    background-color: rgba(255,227,120,.3)
}

.main-03-01-swiper article.EB .img-wrapper::before,.main-03-02-swiper article.EB .img-wrapper::before,.main-03-03-swiper article.EB .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/eb.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.kakaopay .img-wrapper,.main-03-02-swiper article.kakaopay .img-wrapper,.main-03-03-swiper article.kakaopay .img-wrapper {
    background-color: rgba(255,236,77,.3)
}

.main-03-01-swiper article.kakaopay .img-wrapper::before,.main-03-02-swiper article.kakaopay .img-wrapper::before,.main-03-03-swiper article.kakaopay .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/kakaopay.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.DP .img-wrapper,.main-03-02-swiper article.DP .img-wrapper,.main-03-03-swiper article.DP .img-wrapper {
    background-color: rgba(255,212,233,.3)
}

.main-03-01-swiper article.DP .img-wrapper::before,.main-03-02-swiper article.DP .img-wrapper::before,.main-03-03-swiper article.DP .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/dp.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.LT .img-wrapper,.main-03-02-swiper article.LT .img-wrapper,.main-03-03-swiper article.LT .img-wrapper {
    background-color: rgba(219,219,219,.3)
}

.main-03-01-swiper article.LT .img-wrapper::before,.main-03-02-swiper article.LT .img-wrapper::before,.main-03-03-swiper article.LT .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/lt.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.KO .img-wrapper,.main-03-02-swiper article.KO .img-wrapper,.main-03-03-swiper article.KO .img-wrapper {
    background-color: rgba(255,236,77,.3)
}

.main-03-01-swiper article.KO .img-wrapper::before,.main-03-02-swiper article.KO .img-wrapper::before,.main-03-03-swiper article.KO .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/ko.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.KR .img-wrapper,.main-03-02-swiper article.KR .img-wrapper,.main-03-03-swiper article.KR .img-wrapper {
    background-color: rgba(172,207,255,.3)
}

.main-03-01-swiper article.KR .img-wrapper::before,.main-03-02-swiper article.KR .img-wrapper::before,.main-03-03-swiper article.KR .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/kr.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.NV .img-wrapper,.main-03-02-swiper article.NV .img-wrapper,.main-03-03-swiper article.NV .img-wrapper {
    background-color: #defae4
}

.main-03-01-swiper article.NV .img-wrapper::before,.main-03-02-swiper article.NV .img-wrapper::before,.main-03-03-swiper article.NV .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/nv.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.IM .img-wrapper,.main-03-02-swiper article.IM .img-wrapper,.main-03-03-swiper article.IM .img-wrapper {
    background-color: rgba(161,239,211,.3)
}

.main-03-01-swiper article.IM .img-wrapper::before,.main-03-02-swiper article.IM .img-wrapper::before,.main-03-03-swiper article.IM .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/im.webp?ver=240220");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

/* 신규 카드 추가 */
.main-03-01-swiper article.JJ .img-wrapper,.main-03-02-swiper article.JJ .img-wrapper,.main-03-03-swiper article.JJ .img-wrapper {
    background-color: #eef5ff;
}

.main-03-01-swiper article.JJ .img-wrapper::before,.main-03-02-swiper article.JJ .img-wrapper::before,.main-03-03-swiper article.JJ .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/jj.webp");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.SY .img-wrapper,.main-03-02-swiper article.SY .img-wrapper,.main-03-03-swiper article.SY .img-wrapper {
    background-color: #d3eaff
}

.main-03-01-swiper article.SY .img-wrapper::before,.main-03-02-swiper article.SY .img-wrapper::before,.main-03-03-swiper article.SY .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/sy.webp");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.TB .img-wrapper,.main-03-02-swiper article.TB .img-wrapper,.main-03-03-swiper article.TB .img-wrapper {
    background-color: #e7ecf3
}

.main-03-01-swiper article.TB .img-wrapper::before,.main-03-02-swiper article.TB .img-wrapper::before,.main-03-03-swiper article.TB .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/toss.webp");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.JB .img-wrapper,.main-03-02-swiper article.JB .img-wrapper,.main-03-03-swiper article.JB .img-wrapper {
    background-color: #e5f1f6
}

.main-03-01-swiper article.JB .img-wrapper::before,.main-03-02-swiper article.JB .img-wrapper::before,.main-03-03-swiper article.JB .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/jb.webp");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.SM .img-wrapper,.main-03-02-swiper article.SM .img-wrapper,.main-03-03-swiper article.SM .img-wrapper {
    background-color: #e3f3ff
}

.main-03-01-swiper article.SM .img-wrapper::before,.main-03-02-swiper article.SM .img-wrapper::before,.main-03-03-swiper article.SM .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/sm.webp");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.main-03-01-swiper article.KN .img-wrapper,.main-03-02-swiper article.KN .img-wrapper,.main-03-03-swiper article.KN .img-wrapper {
    background-color: #f0eae1
}

.main-03-01-swiper article.KN .img-wrapper::before,.main-03-02-swiper article.KN .img-wrapper::before,.main-03-03-swiper article.KN .img-wrapper::before {
    display: block;
    content: "";
    background-image: url("../images/card/kn.webp");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}


.main-04 {
    content-visibility: auto;
    position: relative;
    padding-top: 5em;
    padding-bottom: 6.25em
}

.main-04 header {
    z-index: 2
}

@media(max-width: 1024px) {
    .main-04 header p {
        display:inline-block !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 0 !important;
        line-height: 0 !important;
        border: 0 !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important
    }
}

@media(max-width: 1024px) {
    .main-04 header {
        width:100%
    }
}

@media(max-width: 1024px) {
    .main-04-01 {
        width:100%
    }
}

@media(max-width: 1024px) {
    .main-04-02 {
        position:absolute;
        bottom: min(3.75em, 16.6666666667vw);
        right: 0;
        width: 30%
    }
}

.main-05 {
    content-visibility: auto;
    padding-bottom: 2.5em
}

.main-05 header {
    border-bottom: 1px solid #666;
    padding-bottom: 1em;
    margin-bottom: 3.125em
}

.main-05 dl dd {
    font-size: .875em;
    color: #888
}

.list-city button {
    border-radius: .5em
}

@media(min-width: 1025px) {
    .list-city button {
        border:1px solid #dcdcdc
    }
}

/* main 추가 */
.mob-br {
	display: block;
}
.main-01 .my-box, .main-01 .login-box {
	padding: 16px 20px 0;
}
.main-card-banner a {
	display: flex;
	width: 100%;
	padding: 28px;
	background-color: #ecf6ff;
	border-radius: 24px;
	align-items: flex-start;
	gap: 8px;
	justify-content: space-between;
	height: 141px;
}
.main-card-banner span {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -0.5px;
    text-align: left;
    width: 100%;
}
.main-card-banner img {
	height: 60px;
	margin-top: 23px;
	margin-right: -8px;
	display: inline-block;
}
.main-02.main-calc-info .main-02-01 {
	width: 100%;
}
.main-02.main-calc-info .title {
	width: 100%;
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 24px;
}
.main-02.main-calc-info .title-desc {
	font-size: 24px;
	margin-bottom: 0;
	font-weight: 700;
}
.main-02.main-calc-info .desc {
	width: 100%;
	margin: 12px 0;
	font-size: 14px;
	color: #666;
	word-break: keep-all;
}
.main-02.main-calc-info .img-box {
	padding: 0 20px;
}
.main-02.main-calc-info img {
	margin-top: 0;
	width: 100%;
}
.main-02.main-calc-info .btn-link {
	height: 48px;
	line-height: 48px;
	width: 100%;
	color: #3f3f3f;
	font-size: 14px;
	border-color: #bababa;
	margin-top: 24px;
}
@media(min-width: 769px){
	.main-02.main-calc-info .main-02-01 {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.main-02.main-calc-info .main-02-01 .text-wrap {
		width: calc(100% - 200px);
	}
	.main-card-banner a {
		align-items: center;
		height: 130px;
	}
	.main-card-banner img {
		margin: 0;
	}
	.main-02.main-calc-info .img-box {
		width: 200px;
	}
	.mob-br {
		display: none;
	}
}
@media(min-width: 1025px) {
	.main-card-banner a {
    	flex-direction: row;
		padding: 0 52px;
		height: 112px;
		align-items: center;
		justify-content: space-between;
	}
	.main-card-banner span {
		font-size: 24px;
	}
	.main-card-banner img {
		height: 80px;
	}
	.main-02.main-calc-info .main-02-01 .text-wrap {
		width: calc(100% - 500px);
	}
	.main-02.main-calc-info .title {
		font-size: 20px;
		font-weight: 500;	
	}
	.main-02.main-calc-info .title-desc {
		font-size: 32px;
	}
	.main-02.main-calc-info .desc {
		font-size: 16px;
	}
	.main-02.main-calc-info .img-box {
		width: 400px;
		margin-bottom: -85px;
	}
	.main-02.main-calc-info .btn-link {
		height: 56px;
		line-height: 56px;
		font-size: 18px;
		max-width: 206px;
	}
}

.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl {
	gap: 12px;
}
.my-box .my-box-dl.new-my-box {
	padding-top: 32px !important;
	padding-bottom: 20px !important;
}
.my-box .my-box-dl.new-my-box.border-type {
	border-bottom: 1px solid #f0f0f0;
}
.my-box .my-box-btn-wrap {
	padding-bottom: 0 !important;
}
.my-box .my-box-btn-wrap .btn {
	font-weight: 500 !important;
}
.my-box .my-box-btn-wrap .btn.type1 {
	color: #fc5b00 !important;
	-webkit-text-fill-color: #fc5b00 !important;
	border-color: #fc5b00 !important;
}

@media(min-width: 1025px) {
	.main-01 .my-box, .main-01 .login-box {
		padding: 40px 28px;
	}
	.main-01 .my-box header~div:not(.group-btn--center,.my-box-empty,.my-box-first,.my-box-calc,.my-box-alert) dl {
		gap: 16px;
	}
	.my-box .my-box-dl.new-my-box {
		padding-bottom: 32px !important;
	}
	.my-box .my-box-btn-wrap .btn {
		font-weight: 700 !important;
	}
}

.main-banner-wrap {
	padding: 0 20px;
}

@media(max-width: 768px) {
	.main-01-swiper-button-prev, .main-01-swiper-button-next {
		width: 32px;
		height: 32px;
		background: url('../images/main/ico-slide-prev.svg') 50% 50% no-repeat;
		background-size: 100%;
		left: 4px;
	}
	.main-01-swiper-button-next {
		left: auto;
		right: 4px;
		background-image: url('../images/main/ico-slide-next.svg');
	}
	.main-01-swiper-button-prev::after, .main-01-swiper-button-next::after {
		content: '';
	}
}

.main-01 .my-box details summary+p > span {
	padding-left: 8px;
	position: relative;
	margin-bottom: 3px;
}
.main-01 .my-box details summary+p > span:last-child {
	margin-bottom: 0;
}
.main-01 .my-box details summary+p > span::before {
	position: absolute;
	content: '';
	width: 3px;
	height: 3px;
	background: #222;
	border-radius: 100%;
	left: 0;
	top: 7px;
}

.content.main {
	padding-bottom: 0 !important;
}

/* 카드정보 업데이트 배너 */
.update-info-banner a {
	display: block;
	height: 0;
	padding-bottom: 45%;
	background: url('../images/main/bg-banner-card-m.png') 50% 50% no-repeat;
    background-size: 100%;
    position: relative;
}

.update-info-banner a::before {
	position: absolute;
	content: '';
	display: block;
	width: 28%;
	height: 45%;
	background: url('../images/main/banner-card-m.png') 50% 50% no-repeat;
	background-size: 100%;
	right: 4.5%;
	top: 50%;
	transform: translateY(-50%);
}
.main-01-swiper img.card-img {
	display: none;
}
@media(min-width: 769px) {
	.update-info-banner {
		margin: 0 20px;
	}
}
@media(min-width: 1025px) {
	.update-info-banner {
		margin: 0;
	}
	.update-info-banner a {
		margin: 0;
		padding-bottom: 0;
		background-image: url('../images/main/bg-banner-card.png');
		background-size: cover;
		border-radius: 20px;
		height: 600px !important;
		overflow: hidden;
	}
	.update-info-banner a::before {
		display: none;
	}
	
	.main-01-swiper img.card-img {
		display: inline-block;
		width: 5716px;
		max-width: none;
		height: 150px;
		position: absolute;
		bottom: 40px;
		left: 0;
		animation: floatCard 80s linear infinite;
	}
	
	@keyframes floatCard {
		from {
			transform: translateX(0);
		}
		to {
			transform: translateX(-87%);
		}
	}
}