@charset "UTF-8";
/*
 *  File Name : /ui_resource/css/responsive/common/layerpopup.css
 *  Description : [공통] 레이어팝업 관련 스타일
 */

/* layerpopup (common) */
[class*=layerpopup-common] .cl-white {color: #fff !important;}
[class*=layerpopup-common] .cl-light-purple {color: #A399FF !important;}
[class*=layerpopup-common] .cl-yellow {color: #FEBB00 !important;}
[class*=layerpopup-common] .bold {color: #FFAE00 !important; font-family: var(--ft-family_Poppins-400) !important;}
[class*=layerpopup-common] {display: none; justify-content: center; align-items: center; z-index: 1000; position: fixed; left: 0; top: 0; width: 100%; height: 100%;}
[class*=layerpopup-common]:after {content: ""; z-index: -1; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8);}
[class*=layerpopup-common] .layer-wrapper {overflow-y: auto; position: relative; width: 415px; /*max-height: 90%;*/background-color: #240075; border: 3px solid #1398FF; border-radius: 18px; box-sizing: border-box; transition: all .7s ease; animation: fadeInScaleEffect 0.5s ease forwards;}
[class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close {z-index: 1; position: absolute; top: 15px; right: 15px; width: 30px; height: 30px;}
[class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::before,
[class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::after {content: ''; position: absolute; left: 50%; top: 50%; width: 42px; height: 4px; background-color: #fff; border-radius: 15px; transform-origin: center;}
[class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::before {transform: translate(-50%, -50%) rotate(45deg);}
[class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::after {transform: translate(-50%, -50%) rotate(-45deg);}
[class*=layerpopup-common] .layer-top-area {text-align: center;}
[class*=layerpopup-common] .layer-top-area > * {display: block;}
[class*=layerpopup-common] .layer-top-area .img-main {margin: 0 auto;}
[class*=layerpopup-common] .layer-inner {display: flex; flex-direction: column; align-items: center; position: relative; height: 100%; padding: 30px 0; box-sizing: border-box;}
[class*=layerpopup-common] .layer-inner > *, 
[class*=layerpopup-common] .layer-contents > * {margin-bottom: 16px;}
[class*=layerpopup-common] .layer-inner > *:last-child {margin-bottom: 0 !important;}
[class*=layerpopup-common] .layer-header {margin-bottom: 10px; text-align: center;}
[class*=layerpopup-common] .layer-header .main-tit {color: #fff; font-family: var(--ft-family_Poppins-700); font-size: 36px; line-height: 1;} 
[class*=layerpopup-common] .layer-header .sub-tit {margin-top: 7px; color: #fff; font-family: var(--ft-family_Poppins-400); font-size: 16px;} 
[class*=layerpopup-common] .layer-contents {display: flex; flex-direction: column; width: 100%; padding: 0 20px; box-sizing: border-box;}
[class*=layerpopup-common] .layer-contents.inner-pd,
[class*=layerpopup-common] .layer-contents .inner-pd {width: calc(100% - 20px) !important; margin: 0 auto 16px;}
[class*=layerpopup-common] .layer-contents .content {color: #A399FF; font-family: var(--ft-family_Poppins-300); font-size: 16px; line-height: 1.4; text-align: center;}
[class*=layerpopup-common] .layer-contents > *:last-child {margin-bottom: 0 !important;}
[class*=layerpopup-common] .layer-contents .infobox {width: 100%; padding: 0 15px; background: #1A0057; border-radius: 8px; border: 2px solid #4B11CD; box-sizing: border-box;}
[class*=layerpopup-common] .layer-contents .infobox .chip-info-area {display: flex; justify-content: center; align-items: center; height: 48px;}
[class*=layerpopup-common] .layer-contents .infobox .chip-info-area > * {margin-right: 6px;;}
[class*=layerpopup-common] .layer-contents .infobox .chip-info-area > *:last-child {margin-right: 0 !important;}
[class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-img {display: inline-block; width: 24px; height: 24px; background: url(../../../images/common/icons/icon_chip.png) center no-repeat; background-size: cover;}
[class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-amount {overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 30px); color: #FEBB00; font-family: var(--ft-family_Poppins-600); font-size: 24px;}
[class*=layerpopup-common] .layer-contents .infobox.type-list {display: flex; flex-direction: column; align-items: center; padding: 15px 20px;}
[class*=layerpopup-common] .layer-contents .infobox.type-list > * {margin-bottom: 10px;}
[class*=layerpopup-common] .layer-contents .infobox.type-list > *:last-child {margin-bottom: 0 !important;}
[class*=layerpopup-common] .layer-contents .infobox.type-list .title {color: #1398FF; font-family: var(--ft-family_Poppins-400); font-size: 16px; text-align: center;}
[class*=layerpopup-common] .layer-contents .infobox.type-list .item {position: relative; padding-left: 15px; margin-bottom: 7px; color: #fff; font-family: var(--ft-family_Poppins-300); font-size: 14px;}
[class*=layerpopup-common] .layer-contents .infobox.type-list .item:last-child {margin-bottom: 0 !important;}
[class*=layerpopup-common] .layer-contents .infobox.type-list .item::before {content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; background: #fff; border-radius: 50%;}
[class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons {display: flex; flex-wrap: wrap; align-items: center; padding-top: 14px;}
[class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item {display: flex; justify-content: center; align-items: center; flex-direction: column; flex: 0 0 calc(20% - 12px); height: 60px; padding: 2px 0; margin-right: 14px; margin-bottom: 10px; background-color: #1A0057; border: 2px solid #4B11CD; box-sizing: border-box; border-radius: 12px;}
[class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item:nth-child(5n) {margin-right: 0 !important;}
[class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon {width: 90%; margin-top: -2px;}
[class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon img {position: relative; top: 5px; width: 100%;}
[class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .cnt {display: inline-block; color: #FFF47A; font-family: var(--ft-family_Poppins-400); font-size: 14px;}
[class*=layerpopup-common] .layer-contents .notice {color: #fff; font-family: var(--ft-family_Poppins-300); font-size: 14px; text-align: center; line-height: 1.4;}
[class*=layerpopup-common] .layer-contents .circle-gauge {display: flex; justify-content: center; margin-top: 5px;} 
[class*=layerpopup-common] .layer-footer .btn-complete {width: 210px; height: 48px;}
[class*=layerpopup-common] .layer-footer .btn-complete .bg-back,
[class*=layerpopup-common] .layer-footer .btn-complete .bg-front {height: 44px; border-radius: 30px;}
[class*=layerpopup-common] .layer-footer .btn-complete .bg-back {top: 3px;}
[class*=layerpopup-common] .layer-footer .btn-complete .front-inner {left: 2px; top: 2px; width: calc(100% - 4px); height: calc(100% - 4px); border-radius: 30px;}
[class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before,
[class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {left: 2px; width: calc(100% - 4px); height: calc(50% - 2px);}
[class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before {top: 2px; border-radius: 170px 170px 0 0;}
[class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {bottom: 2px; border-radius: 0 0 170px 170px;}
[class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt {font-size: 24px;}
[class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 2px; -moz-text-stroke-width: 2px; -ms-text-stroke-width: 2px; text-stroke-width: 2px;}
[class*=layerpopup-common].show {display: flex;}
[class*=layerpopup-common] .layer-wrapper.over-visible .layer-top-area {position: relative; border-radius: 18px 18px 0 0;}
[class*=layerpopup-common] .layer-wrapper.over-visible .layer-top-area .img-main img {width: 100%;}
[class*=layerpopup-common] .layer-wrapper.over-visible .layer-inner {padding-top: 0; border-radius: 18px;}
[class*=layerpopup-common] .layer-wrapper.half-bg {width: 390px;}
[class*=layerpopup-common] .layer-wrapper.half-bg .layer-top-area {height: 200px; width: 100%; border: 3px solid #1A0057; border-bottom: 0; box-sizing: border-box;}
[class*=layerpopup-common] .layer-wrapper.half-bg .layer-top-area .img-main {position: absolute; left: 50%; transform: translateX(-50%);}
[class*=layerpopup-common] .layer-wrapper.half-bg .layer-inner {padding-top: 25px; background-color: #1d0056; border-radius: 0 0 18px 18px;}
[class*=layerpopup-common] .layer-wrapper.w-slim {width: 330px;}
[class*=layerpopup-common] .layer-wrapper.w-slim .layer-contents .content {font-size: 14px;}
[class*=layerpopup-common] .layer-wrapper.over-maxh {overflow-y: auto !important; max-height: 90% !important;}

/* layerpopup (common) : vip */
[class*=layerpopup-common][class*=layerpopup-vip] .layer-wrapper {width: 430px; background-color: #771241; border-color: #febb00;}
[class*=layerpopup-common][class*=layerpopup-vip] .layer-wrapper > .button-layerpopup-close::before,
[class*=layerpopup-common][class*=layerpopup-vip] .layer-wrapper > .button-layerpopup-close::after {background: #febb00;}
[class*=layerpopup-common][class*=layerpopup-vip] .layer-contents .infobox {background-color: #55042a; border-color: #911a51;}
[class*=layerpopup-common][class*=layerpopup-vip] .layer-header .sub-tit {color: #febb00;}

/* layerpopup (common) : promotion */
/* [class*=layerpopup-common][class*=layerpopup-promotion] .layer-wrapper {background-color: #4f00b1; border-color: #7613F1;} */

/* layerpopup-full (common) */
[class*=layerpopup-full-common] {display: none; justify-content: center; align-items: center; z-index: 1000; position: fixed; left: 0; top: 0; width: 100%; height: 100%;}
[class*=layerpopup-full-common]:after {content: ""; z-index: -1; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8);}
[class*=layerpopup-full-common] .layer-wrapper {overflow-y: auto; position: relative; width: 100%; height: 100%; background-color: #1A0057; box-sizing: border-box; transform: translateY(-100%); transition: all .5s ease;}
[class*=layerpopup-full-common] .button-layerpopup-close {z-index: 1; position: absolute; top: 20px; right: 20px; width: 26px; height: 26px;}
[class*=layerpopup-full-common] .button-layerpopup-close::before,
[class*=layerpopup-full-common] .button-layerpopup-close::after {content: ''; position: absolute; left: 50%; top: 50%; width: 36px; height: 4px; background-color: #fff; border-radius: 15px; transform-origin: center;}
[class*=layerpopup-full-common] .button-layerpopup-close::before {transform: translate(-50%, -50%) rotate(45deg);}
[class*=layerpopup-full-common] .button-layerpopup-close::after {transform: translate(-50%, -50%) rotate(-45deg);}
[class*=layerpopup-full-common].show {display: flex;}
[class*=layerpopup-full-common].show .layer-wrapper {transform: translateY(-100%); animation: showLayerFromTop .7s 0s ease forwards;}

/* layerpopup (side) */
[class*=layerpopup-side]:after {content: ""; z-index: 99; position: fixed; left: 0; top: 0; width: 0; height: 0; background: rgba(0, 0, 0, 0.8); transition: all 1s ease;}
[class*=layerpopup-side] .layer-inner {overflow-y: auto; z-index: 101; position: fixed; top: 0; width: 384px; height: 100%; background: #240075;}
[class*=layerpopup-side] .button-layerpopup-close {z-index: 1; position: absolute; top: 20px; width: 26px; height: 26px;}
[class*=layerpopup-side] .button-layerpopup-close::before,
[class*=layerpopup-side] .button-layerpopup-close::after {content: ''; position: absolute; left: 50%; top: 50%; width: 36px; height: 4px; background-color: #fff; border-radius: 15px; transform-origin: center;}
[class*=layerpopup-side] .button-layerpopup-close::before {transform: translate(-50%, -50%) rotate(45deg);}
[class*=layerpopup-side] .button-layerpopup-close::after {transform: translate(-50%, -50%) rotate(-45deg);}
[class*=layerpopup-side] * {color: #fff; font-family: var(--ft-family_Poppins-400); font-size: 24px;}
[class*=layerpopup-side]:after,
[class*=layerpopup-side] .layer-inner {transition: transform .7s ease;}
[class*=layerpopup-side]:after {opacity: 0;}
[class*=layerpopup-side].show:after {width: 100%; height: 100%; opacity: 1; /* animation: fadeInEffect .5s 0s forwards; */}
[class*=layerpopup-side].show .layer-inner {transform: translateX(0);}
.layerpopup-side-left .layer-inner {left: 0; transform: translateX(-100%);}
.layerpopup-side-left .button-layerpopup-close {left: 20px;}
.layerpopup-side-right .layer-inner {right: 0; transform: translateX(100%);}
.layerpopup-side-right .button-layerpopup-close {right: 20px;}

/* layerpopup (mo-menu-comm) : 태블릿부터 노출됨 */
.mo-menu-comm {display: none !important;}

/* layerpopup (profile) */
.layerpopup-profile .layer-inner {background-color: #4211AF;}
.layerpopup-profile .inner-section:nth-of-type(even) {background-color: #240075 !important;}
.layerpopup-profile .profile-area .user-info {display: flex; flex-direction: column; align-items: center; padding: 35px 15px 20px;}
.layerpopup-profile .profile-area .user-info > * {margin-bottom: 10px;}
.layerpopup-profile .profile-area .user-info > *:last-child {margin-bottom: 0 !important;}
.layerpopup-profile .profile-area .user-info .thumb {overflow: hidden; width: 45px; height: 45px; border-radius: 50%;}
.layerpopup-profile .profile-area .user-info .thumb img {width: 100%; height: auto;}
.layerpopup-profile .profile-area .user-info .name {color: #1398FF; font-family: var(--ft-family_Poppins-600); font-size: 22px; word-break: break-all;}
.layerpopup-profile .profile-area .user-info .id {display: flex; justify-content: center; align-items: center; min-width: 105px; height: 20px; padding: 0 10px; background: #240075; border-radius: 15px; box-sizing: border-box; font-size: 12px;}
.layerpopup-profile .profile-area .chip-info,
.layerpopup-profile .profile-area .vip-info {display: flex; justify-content: center; align-items: center; min-height: 70px; padding: 20px 15px; box-sizing: border-box;}
.layerpopup-profile .profile-area .chip-info .amount {position: relative; padding-left: 37px; color: #FEBB00; font-family: var(--ft-family_Poppins-600); font-size: 30px; word-break: break-all;}
.layerpopup-profile .profile-area .chip-info .amount::before {content: ""; display: inline-block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 30px; height: 33px; margin-top: 1px; background: url(../../../images/common/icons/icon_chip.png) center no-repeat; background-size: contain;}
.layerpopup-profile .profile-area .vip-info > * {display: flex; align-items: center; margin-right: 25px;}
.layerpopup-profile .profile-area .vip-info > *:last-child {margin-right: 0 !important;}
.layerpopup-profile .profile-area .vip-info .lv-name {color: #FEBB00; font-family: var(--ft-family_Poppins-600); font-size: 18px;}
.layerpopup-profile .profile-area .vip-info .card-img {margin-left: 5px; width: 36px;}
.layerpopup-profile .profile-area .vip-info .card-img img {width: 100%; vertical-align: middle;}
.layerpopup-profile .profile-area .vip-info .gauge-bar {justify-content: center; position: relative; min-width: 120px; padding: 0 15px 0 35px; height: 20px; background: #240075; border-radius: 15px; box-sizing: border-box;}
.layerpopup-profile .profile-area .vip-info .gauge-bar::before {content: ""; display: inline-block; position: absolute; left: -5px; top: 50%; transform: translateY(-50%); width: 25px; height: 25px; background: url(../../../images/common/icons/icon_point.png) 0 0 no-repeat; background-size: contain;}
.layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info, 
.layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info * {color: #fff; font-size: 12px;}
.layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info .bold {color: #FEBB00;}
.layerpopup-profile .bottom-area {padding: 20px 0; text-align: center;}
.layerpopup-profile .bottom-area .button-logout > .txt {color: #6E56D9; font-family: var(--ft-family_Poppins-700); font-size: 17px; line-height: 1; text-decoration: underline;}

/* layerpopup (login-prompt-comm) */
.layerpopup-login-prompt-comm .layer-wrapper {animation: showLayerFromTop .7s 0s ease forwards;}
.layerpopup-login-prompt-comm .layer-top-area .img-main {width: 228px; margin-top: -80px;}

/* layerpopup (login-prompt) */
.layerpopup-login-prompt .layer-top-area .img-main {width: 170px; margin-top: -64px; margin-bottom: 10px;}
.layerpopup-login-prompt .layer-header .main-tit {font-size: 22px; line-height: 1.35;}
.layerpopup-login-prompt .layer-contents .notice:not(.cl-light-purple) {margin-bottom: 10px; font-size: 16px;}

/* layerpopup (pw-reset-complete) */
.layerpopup-pw-reset-complete .layer-top-area .img-main {width: 226px; margin-top: -64px;}

/* layerpopup (account-create-complete) */
.layerpopup-account-create-complete .layer-top-area .img-main {width: 200px; margin-top: -60px;}
.layerpopup-account-create-complete .layer-header {margin-bottom: 15px;}

/* layerpopup (email-sent-complete) */
.layerpopup-email-sent-complete .layer-top-area .img-main {width: 320px; margin-top: -83px; margin-left: -15px;}

/* layerpopup (weblogin-blocked) */
.layerpopup-weblogin-blocked .layer-top-area .img-main {width: 182px; margin-top: -65px;}
.layerpopup-weblogin-blocked .layer-contents .qr-img {width: 88px; margin: 0 auto;}
.layerpopup-weblogin-blocked .layer-contents .qr-img img {width: 100%;}

/* layerpopup (levelup-reward)*/
.layerpopup-levelup-reward {z-index: 1001;}
.layerpopup-levelup-reward .layer-contents {margin-bottom: 10px !important;}

/* layerpopup (payment-complete) */
.layerpopup-payment-complete .layer-contents .content {color: #fff; font-size: 14px;}
.layerpopup-payment-complete .content-ui {margin-bottom: 0 !important;}
.layerpopup-payment-complete .content-ui > * {margin-bottom: 16px;}
.layerpopup-payment-complete .content-ui > *:last-child {margin-bottom: 0 !important;}

/* layerpopup (vip-open) */
.layerpopup-vip-open .layer-top-area .img-main {width: 200px; margin-top: -35px;}
.layerpopup-vip-open .layer-contents .item-list {display: flex; flex-wrap: wrap; justify-content: center;}
.layerpopup-vip-open .layer-contents .item-list .item {overflow: hidden; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; flex: 1 0 calc(50% - 5px); position: relative; height: 180px; padding-top: 7px; margin: 0 10px 10px 0; background: #55042a; border: 2px solid #911a51; border-radius: 12px; box-sizing: border-box;}
.layerpopup-vip-open .layer-contents .item-list .item:nth-child(2n) {margin-right: 0;}
.layerpopup-vip-open .layer-contents .item-list .item:nth-child(n+3) {margin-bottom: 0;}
.layerpopup-vip-open .layer-contents .item-list .item .thumb-img {width: 80%;}
.layerpopup-vip-open .layer-contents .item-list .item .thumb-img img {width: 100%;}
.layerpopup-vip-open .layer-contents .item-list .item .content-area {position: relative; top: -5px; width: 100%; text-align: center;}
.layerpopup-vip-open .layer-contents .item-list .item .content-area .title {color: #febb00; font-family: var(--ft-family_Poppins-500); font-size: 20px;}
.layerpopup-vip-open .layer-contents .item-list .item .content-area .description {display: flex; justify-content: center; align-items: center; height: 2lh; margin-top: 5px; color: #fff; font-family: var(--ft-family_Poppins-400); font-size: 12px; line-height: 1.4;}

/* layerpopup (vip-levelup) */
.layerpopup-vip-levelup .layer-top-area .img-main {position: relative; padding-bottom: 10px;}
.layerpopup-vip-levelup .layer-top-area .img-main::before,
.layerpopup-vip-levelup .layer-top-area .img-main::after {content: ""; display: inline-block; z-index: 1; position: absolute; top: 62px; width: 76px; background-repeat: no-repeat; background-position: center; background-size: contain;}
.layerpopup-vip-levelup .layer-top-area .img-main::before {left: -44px; height: 33px; background-image: url(../../../images/popup/vip_levelup/img_coins_left.png);}
.layerpopup-vip-levelup .layer-top-area .img-main::after {right: -40px; height: 34px; background-image: url(../../../images/popup/vip_levelup/img_coins_right.png);}
.layerpopup-vip-levelup .layer-top-area .img-main .img {position: relative; display: block;}
.layerpopup-vip-levelup .layer-top-area .img-main .img::before {content: ''; display: inline-block; z-index: -1; position: absolute; left: 50%; bottom: -12px; transform: translateX(-50%); width: 176px; height: 27px; background: url(../../../images/popup/vip_levelup/bg_shadow.png) center no-repeat; background-size: cover;}
.layerpopup-vip-levelup .layer-top-area .img-main img {width: auto; height: 88px;}

/* layerpopup (upsell-unavailable) */
.layerpopup-upsell-unavailable .layer-top-area .img-main {width: 230px; margin-top: -60px;}

/* layerpopup (doubleupoint) */
.layerpopup-doubleupoint .layer-wrapper {position: absolute; right: 0; width: 384px;}
.layerpopup-doubleupoint .button-layerpopup-close {right: 16px; top: 16px;}
.layerpopup-doubleupoint .btn-top-comm {display: flex !important; opacity: 0; animation: fadeInEffect 1s 0s forwards;}
.layerpopup-doubleupoint .top-banner {position: relative; height: 252px; background: url(../../../images/popup/doubleupoint/img_top_banner.jpg) 0 0 no-repeat; background-size: cover;}
.layerpopup-doubleupoint .top-banner .inner-box {display: flex; flex-direction: column; z-index: 1; position: absolute; left: 0; top: 0; height: 100%; padding: 25px 25px 0; box-sizing: border-box;}
.layerpopup-doubleupoint .top-banner .inner-box > * {margin-bottom: 10px;}
.layerpopup-doubleupoint .top-banner .inner-box > *:last-child {margin-bottom: 0 !important;}
.layerpopup-doubleupoint .top-banner .inner-box .title {color: #fff; font-family: var(--ft-family_Poppins-700); font-size: 40px; line-height: .9;}
.layerpopup-doubleupoint .top-banner .inner-box .desc {color: #fff; font-family: var(--ft-family_Poppins-400); font-size: 12px; line-height: 1.4;}
.layerpopup-doubleupoint .top-banner .inner-box .desc .bold {color: #fff47a; font-family: var(--ft-family_Poppins-600);}
.layerpopup-doubleupoint .point-area-comm .point-title {flex-direction: column; text-align: center;}
.layerpopup-doubleupoint .point-area-comm .point-title .title {margin-right: 0; margin-bottom: 10px;}
.layerpopup-doubleupoint .reward-area {display: flex; justify-content: center; padding: 25px 0;}
.layerpopup-doubleupoint .reward-list > .item {display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;}
.layerpopup-doubleupoint .reward-list > .item:last-child {margin-bottom: 0;}
.layerpopup-doubleupoint .reward-list .level-wrap {display: flex; justify-content: center; align-items: center; width: 105px; height: 105px; background-image: url(../../../images/popup/doubleupoint/sp_level_gauge02.png?V=2); background-repeat: no-repeat; background-position: 0 0; background-size: cover;}
.layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm {width: 55px; height: 55px; margin-top: -2px;}
.layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm .num {line-height: 55px; font-size: 17px;}
.layerpopup-doubleupoint .reward-list .reward-wrap {display: flex; flex-direction: column; justify-content: space-between; align-items: center; position: relative; /* width: calc(100% - 115px); */ width: 219px; height: 121px; margin-left: 10px; box-sizing: border-box; background-image: url(../../../images/popup/doubleupoint/bg_reward_box.png); background-repeat: no-repeat; background-position: 0 0; background-size: cover;}
.layerpopup-doubleupoint .reward-list .reward-wrap > * {height: 50%;}
.layerpopup-doubleupoint .reward-list .reward-wrap .set-box {display: flex; justify-content: center; align-items: center; width: calc(100% - 8px); padding-left: 8px; box-sizing: border-box;}
.layerpopup-doubleupoint .reward-list .reward-wrap .set-box .set {display: flex; flex-direction: column; align-items: center; position: relative; width: 45px; height: 45px; padding-top: 2px; margin-right: 5px; border-radius: 9px; border: 2px solid #6D2EFA; background: #250078; box-sizing: border-box;}
.layerpopup-doubleupoint .reward-list .reward-wrap .set-box .set:last-child {margin-right: 0 !important;}
.layerpopup-doubleupoint .reward-list .reward-wrap .set img {width: 90%;}
.layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area {display: flex; justify-content: center; position: absolute; left: 0; bottom: 3px; width: 100%;} 
.layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area .txt {letter-spacing: .1px; color: #FFF47A; font-family: var(--ft-family_Poppins-500); font-size: 10px;}
.layerpopup-doubleupoint .btn-area {display: flex; align-items: center;}
.layerpopup-doubleupoint .btn-claim {width: 130px; height: 40px;}
.layerpopup-doubleupoint .btn-claim .bg-back,
.layerpopup-doubleupoint .btn-claim .bg-front {height: 37px; border-radius: 20px;}
.layerpopup-doubleupoint .btn-claim .bg-back {top: 3px;}
.layerpopup-doubleupoint .btn-claim .front-inner {left: 1px; top: 1px; width: calc(100% - 2px); height: calc(100% - 2px); border-radius: 20px;}
.layerpopup-doubleupoint .btn-claim .front-inner::before,
.layerpopup-doubleupoint .btn-claim .front-inner::after {left: 2px; width: calc(100% - 4px); height: calc(50% - 2px);}
.layerpopup-doubleupoint .btn-claim .front-inner::before {top: 2px; border-radius: 170px 170px 0 0;}
.layerpopup-doubleupoint .btn-claim .front-inner::after {bottom: 2px; border-radius: 0 0 170px 170px;}
.layerpopup-doubleupoint .btn-claim .txt-area .txt {font-size: 22px;}
.layerpopup-doubleupoint .btn-claim .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 2px; -moz-text-stroke-width: 2px; -ms-text-stroke-width: 2px; text-stroke-width: 2px;}
.layerpopup-doubleupoint .claimed-text {color: #6D2EFA; font-family: var(--ft-family_Poppins-700); font-size: 22px;}
.layerpopup-doubleupoint .reward-list > .item[class*=lock] .level-wrap {background-position-y: bottom;}
.layerpopup-doubleupoint .reward-list > .item.unlock .reward-wrap {background-image: url(../../../images/popup/doubleupoint/bg_reward_box-unlock.png);}
.layerpopup-doubleupoint .reward-list > .item.unlock .reward-wrap::after {content: ""; display: inline-block; position: absolute; right: -8px; top: -8px; width: 30px; height: 37px; background: url(../../../images/popup/doubleupoint/icon_unlock.png) 0 0 no-repeat; background-size: contain;}
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim {cursor: pointer; pointer-events: none;}
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim .bg-back {background: linear-gradient(to bottom, #323232 91.28%, #8D8D8D 122.67%); }
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim .bg-front {background: linear-gradient(to bottom, #AAAAAA 0%, #6E6E6E 100%);}
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim .front-inner {background: linear-gradient(to bottom, #8F8F8F 0%, #363636 100%);}
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim .front-inner::before {background: linear-gradient(to bottom, #C2C2C2 38.5% , rgba(255, 255, 255, 0.3) 100%);}
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim .front-inner::after {background: linear-gradient(to bottom, rgba(255, 255, 255, 0.3) 0%, #414141 100%);}
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim .txt-area .txt {color: #CFCFCF;}
.layerpopup-doubleupoint .reward-list > .item.unlock .btn-claim .txt-area .txt:nth-child(1) {-webkit-text-stroke-color: #555; -moz-text-stroke-color: #555; -ms-text-stroke-color: #555; text-stroke-color: #555;}
.layerpopup-doubleupoint .reward-list > .item.lock .level-wrap .icon-level-comm::before {background-image: url(../../../images/common/icons/bg_icon_level-off.png);}
.layerpopup-doubleupoint .reward-list > .item.lock .level-wrap .icon-level-comm .num {color: #3F3F3F;}
.layerpopup-doubleupoint .reward-list > .item.lock .reward-wrap {background-image: url(../../../images/popup/doubleupoint/bg_reward_box-lock.png);}
.layerpopup-doubleupoint .reward-list > .item.lock .set-box {display: none;}

/* layerpopup (promotion-login-bonus) */
.layerpopup-login-bonus .layer-top-area .img-main {width: 330px; margin-top: -16px; margin-left: 10px;}

/* layerpopup (promotion-doubleupoint) - 사용 안함 */
.layerpopup-promotion-doubleupoint .layer-inner {padding-top: 35px;}
.layerpopup-promotion-doubleupoint .layer-header .main-tit {font-size: 30px;}

/* layerpopup (promotion-doubleupoint-toast) - 사용 안함 */
.layerpopup-promotion-doubleupoint-toast .layer-wrapper {width: 550px; margin-top: 42px;}
.layerpopup-promotion-doubleupoint-toast .layer-inner {padding-left: 0; padding-right: 0;}
.layerpopup-promotion-doubleupoint-toast .layer-top-area {margin-top: -84px;}
.layerpopup-promotion-doubleupoint-toast .layer-top-area .img-main img {width: 365px;}
.layerpopup-promotion-doubleupoint-toast .layer-header {margin-top: -25px;}
.layerpopup-promotion-doubleupoint-toast .layer-header .main-tit {font-family: var(--ft-family_Poppins-800);}
.layerpopup-promotion-doubleupoint-toast .layer-header .sub-tit.small-txt,
.layerpopup-promotion-doubleupoint-toast .layer-contents .notice {font-family: var(--ft-family_Poppins-300); font-size: 20px;}
.layerpopup-promotion-doubleupoint-toast .layer-header .sub-tit.small-txt {margin-top: 10px; line-height: 1.3;}
.layerpopup-promotion-doubleupoint-toast .layer-footer {margin-top: 10px;}
.layerpopup-promotion-doubleupoint-toast .layer-footer .checkbox-area {margin-top: 10px; color: #3eb5fe; font-family: var(--ft-family_Poppins-400); font-size: 20px; text-align: center;}
.layerpopup-promotion-doubleupoint-toast .layer-footer .checkbox-area input[type=checkbox] + label {display: flex; justify-content: center; align-items: center; cursor: pointer;}
.layerpopup-promotion-doubleupoint-toast .layer-footer .checkbox-area input[type=checkbox] + label .icon {position: relative; width: 20px; height: 20px; margin-right: 7.5px; border: 1px solid #3eb5fe; box-sizing: border-box; border-radius: 2px;}
.layerpopup-promotion-doubleupoint-toast .layer-footer .checkbox-area input[type=checkbox] + label .icon::before {content: ""; display: none; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; height: 100%; background: url(../../../images/common/icons/icon_checkbox_skyblue.png) center no-repeat; background-size: 12px;}
.layerpopup-promotion-doubleupoint-toast .layer-footer .checkbox-area input[type=checkbox]:checked + label .icon::before {display: block;}

/* layerpopup (promotion-benefit-guide) */
.layerpopup-promotion-benefit-guide .layer-top-area .img-main {width: 300px; margin-top: -93px;}
.layerpopup-promotion-benefit-guide .layer-footer .checkbox-area {margin-top: 10px; color: #1398FF; font-family: var(--ft-family_Poppins-400); font-size: 16px; text-align: center;}
.layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label {display: flex; justify-content: center; align-items: center; cursor: pointer;}
.layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon {position: relative; width: 15px; height: 15px; margin-right: 6px; border: 1px solid #1398FF; box-sizing: border-box; border-radius: 1px;}
.layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon::before {content: ""; display: none; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; height: 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='7' viewBox='0 0 8 7' fill='none'%3E%3Cpath d='M1 4L2.90476 6L7 1' stroke='%231398FF' stroke-width='1.17647' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-size: 9px; background-repeat: no-repeat; background-position: center;}
.layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox]:checked + label .icon::before {display: block;}

/* layerpopup (layerpopup-webstore-voucher) */
.layerpopup-webstore-voucher .layer-wrapper {overflow-x: hidden;}
.layerpopup-webstore-voucher .layer-header .main-tit {line-height: .95;}
.layerpopup-webstore-voucher .layer-header .main-tit > * {display: block; font-family: var(--ft-family_Poppins-700) !important; font-size: 60px;}
.layerpopup-webstore-voucher .layer-header .main-tit .bold {font-size: 40px;}
.layerpopup-webstore-voucher .layer-header .sub-tit,
.layerpopup-webstore-voucher .layer-header .sub-tit * {font-family: var(--ft-family_Poppins-600) !important;}
.layerpopup-webstore-voucher .layer-header .sub-tit {font-size: 20px; line-height: 1;}
.layerpopup-webstore-voucher .layer-contents {align-items: center; margin-top: -10px; margin-bottom: 20px;}
.layerpopup-webstore-voucher .img-area {margin-bottom: 0 !important;}
.layerpopup-webstore-voucher .img-area::before {content: ""; display: inline-block; z-index: -1; position: absolute; left: 0; top: 50%; transform: translateY(-60%); width: 100%; height: 344px; background: url(../../../images/popup/webstore_voucher/bg_coupon.png) center bottom no-repeat; background-size: contain;}
.layerpopup-webstore-voucher .img-area .coupon {display: flex; justify-content: center; align-items: center; position: relative; width: 315px; height: 185px;}
.layerpopup-webstore-voucher .img-area .coupon::before,
.layerpopup-webstore-voucher .img-area .coupon::after {content: ""; display: inline-block; position: absolute; left: -1px; top: 0; width: 100%; height: 100%; background-size: cover; animation: blinkEffect .6s infinite;}
.layerpopup-webstore-voucher .img-area .coupon::before {background-image: url(../../../images/popup/webstore_voucher/coupon_light.png); animation-delay: 0s;}
.layerpopup-webstore-voucher .img-area .coupon::after {background-image: url(../../../images/popup/webstore_voucher/coupon_light_02.png); animation-delay: .3s;}
.layerpopup-webstore-voucher .img-area .coupon img {width: 300px; margin-top: 10px; margin-left: -1px;}
.layerpopup-webstore-voucher .content {margin: 5px 0 12px; color: #fff !important;}
.layerpopup-webstore-voucher .timer-area {display: flex; justify-content: center; align-items: center; position: relative; width: 154px; height: 30px; padding: 0 15px 0 30px; background: #560083; border: 2px solid #FFBC2C; border-radius: 30px; color: #fff; font-family: var(--ft-family_Poppins-300); font-size: 16px; text-align: center; white-space: nowrap; box-sizing: border-box; box-shadow: 0 2.941px 3.529px 0 rgba(0, 0, 0, 0.35);}
.layerpopup-webstore-voucher .timer-area::before {content: ""; position: absolute; left: -20px; top: 50%; transform: translateY(-50%); width: 42px; height: 47px; background: url(../../../images/common/icons/icon_clock.png) 0 0 no-repeat; background-size: cover;}
.layerpopup-webstore-voucher .timer-area .timger {letter-spacing: .5px;}

/* layerpopup (layerpopup-promo-top10-purchase) */
.layerpopup-promo-top10-purchase .layer-wrapper {background-color: #4A1203; border-color: #F4BD1C;}
.layerpopup-promo-top10-purchase .layer-header .main-tit {color: #FFC12D;}
.layerpopup-promo-top10-purchase .layer-contents .content {color: #fff;}
.layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] {padding: 0 !important; background: #671105; border: 2px solid #982514; border-radius: 12px;}
.layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li {display: flex; justify-content: center; align-items: center; height: 40px; border-bottom: 1px solid #982514; color: #fff; font-family: var(--ft-family_Poppins-400); font-size: 20px;}
.layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li:last-child {justify-self: center; border-bottom: 0; font-size: 14px;}
.layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon {margin-right: 4px;}
.layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon img {width: 30px;}
.layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .tit {width: 105px;}
.layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .cont {color: #FFC12D;}
.layerpopup-promo-top10-purchase .layer-contents .notice {color: #fff; line-height: 1.7; font-size: 12px;}

/* layerpopup (layerpopup-promo-top20-purchase) */
.layerpopup-promo-top20-purchase .layer-wrapper {width: 520px;}
.layerpopup-promo-top20-purchase .layer-header .main-tit {font-family: var(--ft-family_Poppins-500);}
.layerpopup-promo-top20-purchase .layer-header .main-tit .bold {display: block; font-family: var(--ft-family_Poppins-700) !important;}
.layerpopup-promo-top20-purchase .layer-contents {text-align: center;}
.layerpopup-promo-top20-purchase .layer-contents * {color: #fff; font-family: var(--ft-family_Poppins-300);}
.layerpopup-promo-top20-purchase .layer-contents .cont {line-height: 1.2; font-size: 16px;}
.layerpopup-promo-top20-purchase .layer-contents .notice {font-size: 14px; line-height: 1.3;}
.layerpopup-promo-top20-purchase .layer-contents .cont + .notice {color: #BB84FF;}
.layerpopup-promo-top20-purchase .layer-contents .table {width: 100%; box-sizing: border-box;}
.layerpopup-promo-top20-purchase .layer-contents .table > img {width: 100%;}

/* 
 *  [해상도 1400px]
 *  - 컨텐츠 inner: 1400px 기준
 *  - 1920 기준 / DPR 1 / 16.6
 */
@media all and (max-width:1400px) {
    /* layerpopup (common) */
    [class*=layerpopup-common] .layer-wrapper {width: 25vw; border-width: 0.181vw; border-radius: 1.084vw;}
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close {top: 0.904vw; right: 0.904vw; width: 1.807vw; height: 1.807vw;}
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::before,
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::after {width: 2.530vw; height: 0.241vw; border-radius: 0.904vw;}
    [class*=layerpopup-common] .layer-inner {padding: 1.807vw 0;}
    [class*=layerpopup-common] .layer-inner > *, 
    [class*=layerpopup-common] .layer-contents > * {margin-bottom: 0.964vw;}
    [class*=layerpopup-common] .layer-header {margin-bottom: 0.602vw;}
    [class*=layerpopup-common] .layer-header .main-tit {font-size: 2.169vw;} 
    [class*=layerpopup-common] .layer-header .sub-tit {margin-top: 0.456vw; font-size: 0.964vw;} 
    [class*=layerpopup-common] .layer-contents {padding: 0 1.205vw;}
    [class*=layerpopup-common] .layer-contents.inner-pd,
    [class*=layerpopup-common] .layer-contents .inner-pd {width: calc(100% - 1.205vw) !important; margin: 0 auto 0.964vw;}
    [class*=layerpopup-common] .layer-contents .content {font-size: 0.964vw;}
    [class*=layerpopup-common] .layer-contents .infobox {padding: 0 0.904vw; border-radius: 0.482vw; border-width: 0.120vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area {height: 2.896vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area > * {margin-right: 0.361vw;;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-img {width: 1.446vw; height: 1.446vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-amount {max-width: calc(100% - 1.807vw); font-size: 1.446vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list {padding: 0.904vw 1.205vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list > * {margin-bottom: 0.602vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .title {font-size: 0.964vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .item {padding-left: 0.904vw; margin-bottom: 0.422vw; font-size: 0.843vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .item::before {width: 0.301vw; height: 0.301vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons {padding-top: 0.843vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item {flex: 0 0 calc(20% - 0.723vw); height: 3.614vw; padding: 0.120vw 0; margin-right: 0.843vw; margin-bottom: 0.602vw; border-width: 0.120vw; border-radius: 0.723vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon {margin-top: -0.120vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon img {top: 0.301vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .cnt {font-size: 0.843vw;}
    [class*=layerpopup-common] .layer-contents .notice {font-size: 0.843vw;}
    [class*=layerpopup-common] .layer-contents .circle-gauge {margin-top: 0.301vw;} 
    [class*=layerpopup-common] .layer-footer .btn-complete {width: 12.651vw; height: 2.896vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-back,
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-front {height: 2.651vw; border-radius: 1.807vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-back {top: 0.181vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner {left: 0.120vw; top: 0.120vw; width: calc(100% - 0.241vw); height: calc(100% - 0.241vw); border-radius: 1.807vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before,
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {left: 0.120vw; width: calc(100% - 0.241vw); height: calc(50% - 0.120vw);}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before {top: 0.120vw; border-radius: 10.241vw 10.241vw 0 0;}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {bottom: 0.120vw; border-radius: 0 0 10.241vw 10.241vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt {font-size: 1.446vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.120vw; -moz-text-stroke-width: 0.120vw; -ms-text-stroke-width: 0.120vw; text-stroke-width: 0.120vw;}
    [class*=layerpopup-common] .layer-wrapper.over-visible .layer-top-area {border-radius: 1.084vw 1.084vw 0 0;}
    [class*=layerpopup-common] .layer-wrapper.over-visible .layer-inner {padding-top: 0; border-radius: 1.084vw;}
    [class*=layerpopup-common] .layer-wrapper.half-bg {width: 23.494vw;}
    [class*=layerpopup-common] .layer-wrapper.half-bg .layer-top-area {height: 12.048vw; border-width: 0.181vw;}
    [class*=layerpopup-common] .layer-wrapper.half-bg .layer-inner {padding-top: 1.506vw; border-radius: 0 0 1.084vw 1.084vw;}
    [class*=layerpopup-common] .layer-wrapper.w-slim {width: 19.88vw;}
    [class*=layerpopup-common] .layer-wrapper.w-slim .layer-contents .content {font-size: 0.843vw;}

    /* layerpopup (common) : vip */
    [class*=layerpopup-common][class*=layerpopup-vip] .layer-wrapper {width: 25.901vw;}

    /* layerpopup-full (common) */
    [class*=layerpopup-full-common] .button-layerpopup-close {top: 1.205vw; right: 1.205vw; width: 1.566vw; height:  1.566vw;}
    [class*=layerpopup-full-common] .button-layerpopup-close::before,
    [class*=layerpopup-full-common] .button-layerpopup-close::after {width: 2.169vw; height: 0.241vw; border-radius: 0.904vw;}

    /* layerpopup (side) */
    [class*=layerpopup-side] .layer-inner {width: 23.133vw;}
    [class*=layerpopup-side] .button-layerpopup-close {top: 1.205vw; width: 1.566vw; height: 1.566vw;}
    [class*=layerpopup-side] .button-layerpopup-close::before,
    [class*=layerpopup-side] .button-layerpopup-close::after {width: 2.169vw; height: 0.241vw; border-radius: 0.904vw;}
    [class*=layerpopup-side] * {font-size: 1.446vw;}
    .layerpopup-side-left .button-layerpopup-close {left: 1.205vw;}
    .layerpopup-side-right .button-layerpopup-close {right: 1.205vw;}

    /* layerpopup (profile) */
    .layerpopup-profile .profile-area .user-info {padding: 2.108vw 0.904vw 1.205vw;}
    .layerpopup-profile .profile-area .user-info > * {margin-bottom: 0.602vw;}
    .layerpopup-profile .profile-area .user-info .thumb {width: 2.711vw; height: 2.711vw;}
    .layerpopup-profile .profile-area .user-info .name {font-size: 1.325vw;}
    .layerpopup-profile .profile-area .user-info .id {min-width: 6.325vw; height: 1.205vw; padding: 0 0.602vw; border-radius: 0.904vw; font-size: 0.723vw;}
    .layerpopup-profile .profile-area .chip-info,
    .layerpopup-profile .profile-area .vip-info {min-height: 4.217vw; padding: 1.205vw 0.904vw;}
    .layerpopup-profile .profile-area .chip-info .amount {padding-left: 2.229vw; font-size: 1.807vw;}
    .layerpopup-profile .profile-area .chip-info .amount::before {width: 1.807vw; height: 1.988vw; margin-top: 0.060vw;}
    .layerpopup-profile .profile-area .vip-info > * {margin-right: 1.506vw;}
    .layerpopup-profile .profile-area .vip-info .lv-name {font-size: 1.084vw;}
    .layerpopup-profile .profile-area .vip-info .card-img {margin-left: 0.301vw; width: 2.169vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar {min-width: 12.651vw; padding: 0 0.904vw 0 2.108vw; height: 1.205vw; border-radius: 0.904vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar::before {left: -0.301vw; width: 1.506vw; height: 1.506vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info, 
    .layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info * {font-size: 0.723vw;}
    .layerpopup-profile .bottom-area {padding: 1.205vw 0;}
    .layerpopup-profile .bottom-area .button-logout > .txt {font-size: 1.024vw;}

    /* layerpopup (login-prompt-comm) */
    .layerpopup-login-prompt-comm .layer-top-area .img-main {width: 13.735vw; margin-top: -4.819vw;}

    /* layerpopup (login-prompt) */
    .layerpopup-login-prompt .layer-top-area .img-main {width: 10.241vw; margin-top: -3.855vw; margin-bottom: 0.602vw;}
    .layerpopup-login-prompt .layer-header .main-tit {font-size: 1.325vw;}
    .layerpopup-login-prompt .layer-contents .notice:not(.cl-light-purple) {margin-bottom: 0.602vw; font-size: 0.964vw;}

    /* layerpopup (pw-reset-complete) */
    .layerpopup-pw-reset-complete .layer-top-area .img-main {width: 13.614vw; margin-top: -3.855vw;}

    /* layerpopup (account-create-complete) */
    .layerpopup-account-create-complete .layer-top-area .img-main {width: 12.048vw; margin-top: -3.614vw;}
    .layerpopup-account-create-complete .layer-header {margin-bottom: 0.904vw;}

    /* layerpopup (email-sent-complete) */
    .layerpopup-email-sent-complete .layer-top-area .img-main {width: 19.277vw; margin-top: -5vw; margin-left: -0.904vw;}

    /* layerpopup (weblogin-blocked) */
    .layerpopup-weblogin-blocked .layer-top-area .img-main {width: 10.964vw; margin-top: -3.916vw;}
    .layerpopup-weblogin-blocked .layer-contents .qr-img {width: 5.301vw;}

    /* layerpopup (levelup-reward)*/
    .layerpopup-levelup-reward .layer-contents {margin-bottom: 0.602vw !important;}

    /* layerpopup (payment-complete) */
    .layerpopup-payment-complete .layer-contents .content {font-size: 0.843vw;}
    .layerpopup-payment-complete .content-ui > * {margin-bottom: 0.964vw;}

    /* layerpopup (vip-open) */
    .layerpopup-vip-open .layer-top-area .img-main {width: 12.048vw; margin-top: -2.108vw;}
    .layerpopup-vip-open .layer-contents .item-list .item {flex: 1 0 calc(50% - 0.301vw); height: 10.843vw; padding-top: 0.422vw; margin: 0 0.602vw 0.602vw 0; border-width: 0.120vw; border-radius: 0.723vw;}
    .layerpopup-vip-open .layer-contents .item-list .item .content-area {top: -0.301vw;}
    .layerpopup-vip-open .layer-contents .item-list .item .content-area .title {font-size: 1.205vw;}
    .layerpopup-vip-open .layer-contents .item-list .item .content-area .description {margin-top: 0.301vw; font-size: 0.723vw;}

    /* layerpopup (vip-levelup) */
    .layerpopup-vip-levelup .layer-top-area .img-main {padding-bottom: 0.602vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::before,
    .layerpopup-vip-levelup .layer-top-area .img-main::after {top: 3.735vw; width: 4.578vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::before {left: -2.651vw; height: 1.988vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::after {right: -2.41vw; height: 2.048vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main .img::before {bottom: -0.723vw; width: 10.602vw; height: 1.627vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main img {height: 5.301vw;}

    /* layerpopup (upsell-unavailable) */
    .layerpopup-upsell-unavailable .layer-top-area .img-main {width: 13.855vw; margin-top: -3.614vw;}

    /* layerpopup (doubleupoint) */
    .layerpopup-doubleupoint .layer-wrapper {width: 23.133vw;}
    .layerpopup-doubleupoint .button-layerpopup-close {right: 0.964vw; top: 0.964vw;}
    .layerpopup-doubleupoint .top-banner {height: 15.181vw;}
    .layerpopup-doubleupoint .top-banner .inner-box {padding: 1.506vw 1.506vw 0;}
    .layerpopup-doubleupoint .top-banner .inner-box > * {margin-bottom: 0.602vw;}
    .layerpopup-doubleupoint .top-banner .inner-box .title {font-size: 2.41vw;}
    .layerpopup-doubleupoint .top-banner .inner-box .desc {font-size: 0.723vw;}
    .layerpopup-doubleupoint .point-area-comm .point-title .title {margin-bottom: 0.602vw;}
    .layerpopup-doubleupoint .reward-area {padding: 1.506vw 0;}
    .layerpopup-doubleupoint .reward-list > .item {margin-bottom: 1.205vw;}
    .layerpopup-doubleupoint .reward-list .level-wrap {width: 6.325vw; height: 6.325vw;}
    .layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm {width: 3.313vw; height: 3.313vw; margin-top: -0.120vw;}
    .layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm .num {line-height: 3.313vw; font-size: 1.024vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap { width: 13.193vw; height: 7.289vw; margin-left: 0.602vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set-box {width: calc(100% - 0.482vw); padding-left: 0.482vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set-box .set {width: 2.711vw; height: 2.711vw; padding-top: 0.120vw; margin-right: 0.301vw; border-radius: 0.542vw; border-width: 0.120vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area {bottom: 0.181vw;} 
    .layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area .txt {letter-spacing: 0.006vw; font-size: 0.602vw;}
    .layerpopup-doubleupoint .btn-claim {width: 7.831vw; height: 2.41vw;}
    .layerpopup-doubleupoint .btn-claim .bg-back,
    .layerpopup-doubleupoint .btn-claim .bg-front {height: 2.229vw; border-radius: 1.205vw;}
    .layerpopup-doubleupoint .btn-claim .bg-back {top: 0.181vw;}
    .layerpopup-doubleupoint .btn-claim .front-inner {left: 0.060vw; top: 0.060vw; width: calc(100% - 0.120vw); height: calc(100% - 0.120vw); border-radius: 1.205vw;}
    .layerpopup-doubleupoint .btn-claim .front-inner::before,
    .layerpopup-doubleupoint .btn-claim .front-inner::after {left: 0.120vw; width: calc(100% - 0.241vw); height: calc(50% - 0.120vw);}
    .layerpopup-doubleupoint .btn-claim .front-inner::before {top: 0.120vw; border-radius: 10.241vw 10.241vw 0 0;}
    .layerpopup-doubleupoint .btn-claim .front-inner::after {bottom: 0.120vw; border-radius: 0 0 10.241vw 10.241vw;}
    .layerpopup-doubleupoint .btn-claim .txt-area .txt {font-size: 1.325vw;}
    .layerpopup-doubleupoint .btn-claim .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.120vw; -moz-text-stroke-width: 0.120vw; -ms-text-stroke-width: 0.120vw; text-stroke-width: 0.120vw;}
    .layerpopup-doubleupoint .claimed-text {font-size: 1.325vw;}
    .layerpopup-doubleupoint .reward-list > .item.unlock .reward-wrap::after {right: -0.482vw; top: -0.482vw; width: 1.807vw; height: 2.229vw;}

    /* layerpopup (promotion-login-bonus) */
    .layerpopup-login-bonus .layer-top-area .img-main {width: 19.88vw; margin-top: -0.964vw; margin-left: 0.602vw;}

    /* layerpopup (promotion-benefit-guide) */
    .layerpopup-promotion-benefit-guide .layer-top-area .img-main {width: 18.072vw; margin-top: -5.602vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area {margin-top: 0.602vw; font-size: 0.964vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon {width: 0.904vw; height: 0.904vw; margin-right: 0.361vw; border-radius: 0.060vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon::before {background-size: 0.542vw;}

    /* layerpopup (layerpopup-webstore-voucher) */
    .layerpopup-webstore-voucher .layer-header .main-tit > * {font-size: 3.614vw;}
    .layerpopup-webstore-voucher .layer-header .main-tit .bold {font-size: 2.41vw;}
    .layerpopup-webstore-voucher .layer-header .sub-tit {font-size: 1.205vw;}
    .layerpopup-webstore-voucher .layer-contents {margin-top: -0.602vw; margin-bottom: 1.205vw;}
    .layerpopup-webstore-voucher .img-area::before {height: 20.723vw;}
    .layerpopup-webstore-voucher .img-area .coupon {width: 18.976vw; height: 11.145vw;}
    .layerpopup-webstore-voucher .img-area .coupon::before,
    .layerpopup-webstore-voucher .img-area .coupon::after {left: -0.060vw;}
    .layerpopup-webstore-voucher .img-area .coupon img {width: 18.072vw; margin-top: 0.602vw; margin-left: -0.060vw;}
    .layerpopup-webstore-voucher .content {margin: 0.301vw 0 0.723vw;}
    .layerpopup-webstore-voucher .timer-area {width: 9.277vw; height: 1.807vw; padding: 0 0.904vw 0 1.807vw; border-width: 0.120vw; border-radius: 1.807vw; font-size: 0.964vw; box-shadow: 0 0.177vw 0.213vw 0 rgba(0, 0, 0, 0.35);}
    .layerpopup-webstore-voucher .timer-area::before {left: -1.205vw; width: 2.530vw; height: 2.831vw;}
    .layerpopup-webstore-voucher .timer-area .timger {letter-spacing: 0.030vw;}

    /* layerpopup (layerpopup-promo-top10-purchase) */
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] {border-width: 0.120vw; border-radius: 0.723vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li {height: 2.41vw; border-width: 0.060vw; font-size: 1.205vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li:last-child {font-size: 0.843vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon {margin-right: 0.241vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon img {width: 1.807vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .tit {width: 6.325vw;}
    .layerpopup-promo-top10-purchase .layer-contents .notice {font-size: 0.723vw;}

    /* layerpopup (layerpopup-promo-top20-purchase) */
    .layerpopup-promo-top20-purchase .layer-wrapper {width: 31.325vw;}
    .layerpopup-promo-top20-purchase .layer-contents .cont {font-size: 0.964vw;}
    .layerpopup-promo-top20-purchase .layer-contents .notice {font-size: 0.843vw;}
}

/* 
 *  [해상도 481px ~ 1024px]
 *  1. 769px ~ 1024px
 *  - 낮은 해상도의 PC
 *  - 태블릿 가로모드
 *
 *  2. 481px ~ 768px]
 *  - 모바일 가로모드
 *  - 태블릿 세로모드
 *
 *  3. 768 기준 / DPR 2 / 7.68
 *  4. 태블릿 ui 적용 (mode-tablet)
 *  5. 터치 기반 디바이스 ui 적용 (mode-touch): 태블릿+모바일
 */
@media all and (max-width:1024px) {
    /* layerpopup (common) */
    [class*=layerpopup-common] .layer-wrapper {width: 42.969vw; border-width: 0.26vw; border-radius: 1.953vw;}
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close {top: 1.432vw; right: 1.432vw; width: 3.385vw; height: 3.385vw;}
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::before,
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::after {width: 4.787vw; height: 0.52vw; border-radius: 0.904vw;}
    [class*=layerpopup-common] .layer-inner {padding: 3.255vw 0;}    
    [class*=layerpopup-common] .layer-inner > *, 
    [class*=layerpopup-common] .layer-contents > * {margin-bottom: 1.5625vw;}
    [class*=layerpopup-common] .layer-header {margin-bottom: 1vw;}
    [class*=layerpopup-common] .layer-header .main-tit {font-size: 3.906vw;} 
    [class*=layerpopup-common] .layer-header .sub-tit {margin-top: 0.911vw; font-size: 1.5625vw;} 
    [class*=layerpopup-common] .layer-contents {padding: 0 1.953vw;} 
    [class*=layerpopup-common] .layer-contents.inner-pd,
    [class*=layerpopup-common] .layer-contents .inner-pd {width: calc(100% - 3.906vw) !important; margin: 0 auto 1.5625vw;}
    [class*=layerpopup-common] .layer-contents .content {font-size: 1.5625vw;}
    [class*=layerpopup-common] .layer-contents .infobox {padding: 0 1.302vw; border-radius: 0.781vw; border-width: 0.195vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area {height: 5.339vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area > * {margin-right: 0.781vw;;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-img {width: 2.604vw; height: 2.604vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-amount {max-width: calc(100% - 3.385vw); font-size: 2.604vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list {padding: 1.823vw 0.021vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list > * {margin-bottom: 1.5625vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .title {font-size: 1.562vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .item {padding-left: 1.042vw; margin-bottom: 0.911vw; font-size: 1.432vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .item::before {width: 0.391vw; height: 0.391vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons {padding-top: 1.628vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item {flex: 0 0 calc(20% - 1.25vw); height: 5.859vw; padding: 0.326vw 0; margin-right: 1.5625vw; margin-bottom: 1vw; border-width: 0.195vw; border-radius: 1.172vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon {margin-top: -0.13vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon img {top: 0.301vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .cnt {font-size: 1.302vw;}
    [class*=layerpopup-common] .layer-contents .notice {font-size: 1.5625vw;}    
    [class*=layerpopup-common] .layer-contents .circle-gauge {margin-top: 0.651vw;} 
    [class*=layerpopup-common] .layer-footer .btn-complete {width: 23.4375vw; height: 5.208vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-back,
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-front {height: 4.88vw; border-radius: 2.604vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-back {top: 0.326vw;}    
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner {left: 0.13vw; top: 0.13vw; width: calc(100% - 0.26vw); height: calc(100% - 0.26vw); border-radius: 2.604vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before,
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {left: 0.13vw; width: calc(100% - 0.26vw); height: calc(50% - 0.13vw);}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before {top: 0.13vw; border-radius: 22.135vw 22.135vw 0 0;}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {bottom: 0.13vw; border-radius: 0 0 22.135vw 22.135vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt {font-size: 2.865vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.13vw; -moz-text-stroke-width: 0.13vw; -ms-text-stroke-width: 0.13vw; text-stroke-width: 0.13vw;}
    [class*=layerpopup-common] .layer-wrapper.over-visible .layer-top-area {border-radius: 1.953vw 1.953vw 0 0;} 
    [class*=layerpopup-common] .layer-wrapper.over-visible .layer-inner {border-radius: 1.953vw;} 
    [class*=layerpopup-common] .layer-wrapper.half-bg {width: 42.969vw;}
    [class*=layerpopup-common] .layer-wrapper.half-bg .layer-top-area {height: 22.786vw; border-width: 0.521vw;}
    [class*=layerpopup-common] .layer-wrapper.half-bg .layer-inner {padding-top: 2.279vw; border-radius: 0 0 1.953vw 1.953vw;}
    [class*=layerpopup-common] .layer-wrapper.w-slim {width: 36.458vw;}
    [class*=layerpopup-common] .layer-wrapper.w-slim .layer-contents .content {font-size: 1.5625vw; letter-spacing: .02vw;}

    /* layerpopup (common) : vip */
    [class*=layerpopup-common][class*=layerpopup-vip] .layer-wrapper {width: 48.177vw;}

    /* layerpopup-full (common) */
    [class*=layerpopup-full-common] .button-layerpopup-close {top: 2.604vw; right: 2.604vw; width: 3.385vw; height: 3.385vw;}
    [class*=layerpopup-full-common] .button-layerpopup-close::before,
    [class*=layerpopup-full-common] .button-layerpopup-close::after {width: 4.787vw; height: 0.521vw; border-radius: 3.906vw;}

    /* layerpopup (side) */
    [class*=layerpopup-side] .layer-inner {width: 50%;}
    [class*=layerpopup-side] .button-layerpopup-close {top: 2.604vw; width: 3.385vw; height: 3.385vw;}
    [class*=layerpopup-side] .button-layerpopup-close::before,
    [class*=layerpopup-side] .button-layerpopup-close::after {width: 4.787vw; height: 0.521vw; border-radius: 3.906vw;}
    [class*=layerpopup-side] * {font-size: 1.5625vw;}
    .layerpopup-side-left .button-layerpopup-close {left: 2.604vw;}
    .layerpopup-side-right .button-layerpopup-close {right: 2.604vw;}

    /* layerpopup (mo-menu-comm) */
    .mo-menu-comm.show {display: block !important;}
    .mo-menu-comm .layer-inner {/*padding: 8.464vw 1.953vw 0;*/ padding: 8.203vw 1.953vw 0; box-sizing: border-box; background-color: #240075;}
    .mo-menu-comm .layer-inner::before {content: ''; display: inline-block; position: absolute; left: 0; /*top: 8.464vw;*/ top: 8.203vw; width: 100%; height: 0.26vw; background-color: #1398FF;}
    .mo-menu-comm .menu-area {margin: 0.651vw 0 9.115vw;}
    .mo-menu-comm .menu-area .menu-item > a {display: flex; align-items: center; position: relative; width: 100%; height: 9.115vw; padding: 0 2.604vw; box-sizing: border-box; color: #fff; font-family: var(--ft-family_Poppins-300); font-size: 3.906vw;}
    .mo-menu-comm .menu-area .menu-item.active > a {color: #1398FF; font-family: var(--ft-family_Poppins-600);}

    /* layerpopup (gnb) */
    .layerpopup-gnb .menu-area .lnb {display: none; margin-bottom: 5.208vw;}
    .layerpopup-gnb .menu-area .lnb .lnb-item {padding: 0 2.604vw; box-sizing: border-box;}
    .layerpopup-gnb .menu-area .lnb .lnb-item > a {display: flex; align-items: center; width: 100%; height: 5.208vw; padding: 0 1.302vw; box-sizing: border-box; color: #fff; font-family: var(--ft-family_Poppins-300); font-size: 2.344vw;}
    .layerpopup-gnb .menu-area .gnb-item.has-depth > a::after {content: ""; display: inline-block; position: absolute; right: 2.604vw; top: 50%; transform: translateY(-50%); width: 2.604vw; height: 1.302vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='20' viewBox='0 0 40 20' fill='none'%3E%3Cpath d='M40 0L0 0L19.1304 20L40 0Z' fill='white'/%3E%3C/svg%3E"); background-size: cover;}
    .layerpopup-gnb .menu-area .gnb-item.has-depth.active > a::after {transform: translateY(-50%) rotate(180deg); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='20' viewBox='0 0 40 20' fill='none'%3E%3Cpath d='M40 0L0 0L19.1304 20L40 0Z' fill='%231398FF'/%3E%3C/svg%3E");}
    .layerpopup-gnb .menu-area .gnb-item.active .lnb {display: block;}
    .layerpopup-gnb .menu-area .lnb .lnb-item.active > a {color: #1398FF; font-family: var(--ft-family_Poppins-400);}
    .layerpopup-gnb .bottom-area {display: flex; flex-direction: column; align-items: center; padding: 5.208vw 0; border-top: 0.26vw solid #3811AE;}
    .layerpopup-gnb .bottom-area > * {margin-bottom: 5.208vw;}
    .layerpopup-gnb .bottom-area > *:last-child {margin-bottom: 0 !important;}
    .layerpopup-gnb .btn-play {width: 32.552vw; height: 7.617vw;}
    .layerpopup-gnb .btn-play .bg-back,
    .layerpopup-gnb .btn-play .bg-front {height: 7.161vw; border-radius: 3.711vw;}
    .layerpopup-gnb .btn-play .bg-back {top: 0.456vw; box-shadow: 0 0.464vw 0.371vw 0 rgba(0, 0, 0, 0.30);}
    .layerpopup-gnb .btn-play .front-inner {left: 0.195vw; top: 0.195vw; width: calc(100% - 0.391vw); height: calc(100% - 0.391vw); border-radius: 3.711vw;}
    .layerpopup-gnb .btn-play .front-inner::before,
    .layerpopup-gnb .btn-play .front-inner::after {left: 0.195vw; width: calc(100% - 0.391vw); height: calc(50% - 0.195vw);}
    .layerpopup-gnb .btn-play .front-inner::before {top: 0.195vw; border-radius: 31.51vw 31.51vw 0 0; }
    .layerpopup-gnb .btn-play .front-inner::after {bottom: 0.195vw; border-radius: 0 0 31.51vw 31.51vw;}
    .layerpopup-gnb .btn-play .txt-area .txt {font-size: 3.906vw;}
    .layerpopup-gnb .btn-play .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.391vw; -moz-text-stroke-width: 0.391vw; -ms-text-stroke-width: 0.391vw; text-stroke-width: 0.391vw;}
    .layerpopup-gnb .sns-btns-comm [class*=btn-item] {width: 5.208vw; height: 5.208vw; margin: 0 1.953vw;}

    /* layerpopup (terms-menu) */ 
    .layerpopup-terms-menu .layer-inner {padding-left: 1.302vw; padding-right: 1.302vw;}
    .layerpopup-terms-menu .menu-area .menu-item > a {font-size: 3.646vw;} 

    /* layerpopup (profile) */
    .layerpopup-profile .profile-area .user-info {padding: 2.279vw 1.302vw 2.604vw;}
    .layerpopup-profile .profile-area .user-info > * {margin-bottom: 1.302vw;}
    .layerpopup-profile .profile-area .user-info .thumb {width: 5.859vw; height: 5.859vw;}
    .layerpopup-profile .profile-area .user-info .name {font-size: 2.214vw;}
    .layerpopup-profile .profile-area .user-info .id {min-width: 13.672vw; height: 2.604vw; padding: 0 1.953vw; border-radius: 1.953vw; font-size: 1.5625vw;}
    .layerpopup-profile .profile-area .chip-info,
    .layerpopup-profile .profile-area .vip-info {min-height: 9.1146vw; padding: 1.953vw 1.302vw;}    
    .layerpopup-profile .profile-area .chip-info .amount {padding-left: 4.818vw; font-size: 3.906vw;}    
    .layerpopup-profile .profile-area .chip-info .amount::before {width: 3.841vw; height: 3.971vw; margin-top: 0.25vw;}
    .layerpopup-profile .profile-area .vip-info > * {margin-right: 3.255vw;}
    .layerpopup-profile .profile-area .vip-info .lv-name {font-size: 2.344vw;}
    .layerpopup-profile .profile-area .vip-info .card-img {margin-left: 0.78125vw; width: 4.6875vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar {min-width: 15.625vw; padding: 0 1.302vw 0 2.604vw; height: 2.604vw; border-radius: 1.953vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar::before {left: -0.651vw; width: 3.255vw; height: 3.255vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info, 
    .layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info * {font-size: 1.5625vw;}
    .layerpopup-profile .bottom-area {padding: 2.604vw 0;}
    .layerpopup-profile .bottom-area .button-logout > .txt {font-size: 2.214vw;}

    /* layerpopup (login-prompt-comm) */
    .layerpopup-login-prompt-comm .layer-top-area .img-main {width: 25.26vw; margin-top: -8.659vw;}

    /* layerpopup (login-prompt) */
    .layerpopup-login-prompt .layer-top-area .img-main {width: 18.88vw; margin-top: -7.292vw; margin-bottom: 0.651vw;}
    .layerpopup-login-prompt .layer-header .main-tit {font-size: 2.344vw;}
    .layerpopup-login-prompt .layer-contents .notice:not(.cl-light-purple) {margin-bottom: 1.302vw; font-size: 1.5625vw;}

    /* layerpopup (pw-reset-complete) */
    .layerpopup-pw-reset-complete .layer-top-area .img-main {width: 25vw; margin-top: -6.51vw;}

    /* layerpopup (account-create-complete) */
    .layerpopup-account-create-complete .layer-top-area .img-main {width: 22.135vw; margin-top: -6.901vw;}
    .layerpopup-account-create-complete .layer-header {margin-bottom: 1.953vw;}

    /* layerpopup (email-sent-complete) */
    .layerpopup-email-sent-complete .layer-top-area .img-main {width: 35.156vw; margin-top: -8.724vw; margin-left: -1.302vw;}

    /* layerpopup (weblogin-blocked) */
    .layerpopup-weblogin-blocked .layer-top-area .img-main {width: 20.052vw; margin-top: -6.901vw;}
    .layerpopup-weblogin-blocked .layer-contents .qr-img {width: 9.766vw;}

    /* layerpopup (levelup-reward)*/
    .layerpopup-levelup-reward .layer-contents {margin-bottom: 1vw !important;}

    /* layerpopup (payment-complete) */
    .layerpopup-payment-complete .layer-contents .content {font-size: 1.5625vw;}
    .layerpopup-payment-complete .content-ui > * {margin-bottom: 1.953vw;}

    /* layerpopup (vip-open) */
    .layerpopup-vip-open .layer-top-area .img-main {width: 22.331vw; margin-top: -4.1016vw;}
    .layerpopup-vip-open .layer-contents .item-list .item {flex: 1 0 calc(50% - 0.781vw); height: 19.271vw; padding-top: 0.391vw; margin: 0 1.5625vw 1.5625vw 0; border-width: 0.195vw; border-radius: 1.302vw;}
    .layerpopup-vip-open .layer-contents .item-list .item .content-area .title {font-size: 2.214vw;}
    .layerpopup-vip-open .layer-contents .item-list .item .content-area .description {margin-top: 0.301vw; font-size: 1.302vw;}

    /* layerpopup (vip-levelup) */
    .layerpopup-vip-levelup .layer-top-area .img-main {padding-bottom: 0.602vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::before,
    .layerpopup-vip-levelup .layer-top-area .img-main::after {top: 6.771vw; width: 6.510vw; height: 3.646vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::before {left: -4.818vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::after {right: -4.427vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main .img::before {bottom: -1.302vw; width: 19.27vw; height: 2.93vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main img {height: 9.57vw;}

    /* layerpopup (upsell-unavailable) */
    .layerpopup-upsell-unavailable .layer-top-area .img-main {width: 25.39vw; margin-top: -6.51vw;}

    /* layerpopup (doubleupoint) */
    .layerpopup-doubleupoint .layer-wrapper {width: 50%;}
    .layerpopup-doubleupoint .button-layerpopup-close {right: 2.604vw; top: 2.409vw;}
    .layerpopup-doubleupoint .top-banner {height: 32.8125vw;}
    .layerpopup-doubleupoint .top-banner .inner-box {padding: 3.255vw 3.255vw 0;}
    .layerpopup-doubleupoint .top-banner .inner-box > * {margin-bottom: 1.302vw;}
    .layerpopup-doubleupoint .top-banner .inner-box .title {font-size: 5.208vw;}
    .layerpopup-doubleupoint .top-banner .inner-box .desc {font-size: 1.5625vw;}
    .layerpopup-doubleupoint .point-area-comm .point-title .title {margin-bottom: 0.977vw;}
    .layerpopup-doubleupoint .reward-area {padding: 3.255vw 0;}
    .layerpopup-doubleupoint .reward-list > .item {margin-bottom: 2.6041vw;}
    .layerpopup-doubleupoint .reward-list .level-wrap {width: 13.672vw; height: 13.672vw;}
    .layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm {width: 7.161vw; height: 7.161vw; margin-top: 0;}
    .layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm .num {line-height: 7.161vw; font-size: 2.214vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap {width: 28.516vw; height: 15.885vw; margin-left: 0.651vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set-box {width: calc(100% - 0.488vw); padding-left: 0.781vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set-box .set {width: 5.859vw; height: 5.859vw; padding-top: 0.651vw; margin-right: 0.651vw; border-radius: 1.172vw; border-width: 0.26vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set img {width: 80%;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area {bottom: 0.521vw;} 
    .layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area .txt {font-size: 1.302vw;}
    .layerpopup-doubleupoint .btn-claim {width: 16.927vw; height: 5.208vw;}
    .layerpopup-doubleupoint .btn-claim .bg-back,
    .layerpopup-doubleupoint .btn-claim .bg-front {height: 4.88vw; border-radius: 2.604vw;}
    .layerpopup-doubleupoint .btn-claim .bg-back {top: 0.326vw;}
    .layerpopup-doubleupoint .btn-claim .front-inner {left: 0.13vw; top: 0.13vw; width: calc(100% - 0.26vw); height: calc(100% - 0.26vw); border-radius: 2.604vw;}
    .layerpopup-doubleupoint .btn-claim .front-inner::before,
    .layerpopup-doubleupoint .btn-claim .front-inner::after {left: 0.13vw; width: calc(100% - 0.26vw); height: calc(50% - 0.26vw);}
    .layerpopup-doubleupoint .btn-claim .front-inner::before {top: 0.26vw; border-radius: 22.135vw 22.135vw 0 0;}
    .layerpopup-doubleupoint .btn-claim .front-inner::after {bottom: 0.26vw; border-radius: 0 0 22.135vw 22.135vw;}
    .layerpopup-doubleupoint .btn-claim .txt-area .txt {font-size: 2.865vw;}
    .layerpopup-doubleupoint .btn-claim .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.26vw; -moz-text-stroke-width: 0.26vw; -ms-text-stroke-width: 0.26vw; text-stroke-width: 0.26vw;}
    .layerpopup-doubleupoint .claimed-text {font-size: 2.865vw;}
    .layerpopup-doubleupoint .reward-list > .item.unlock .reward-wrap::after {right: -1.0417vw; top: -1.0417vw; width: 3.906vw; height: 4.753vw;}

    /* layerpopup (promotion-login-bonus) */
    .layerpopup-login-bonus .layer-top-area .img-main {width: 36.654vw; margin-top: -1.628vw; margin-left: 1.237vw;}

    /* layerpopup (promotion-benefit-guide) */
    .layerpopup-promotion-benefit-guide .layer-top-area .img-main {width: 33.203vw; margin-top: -10.221vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area {margin-top: 1.302vw; font-size: 1.563vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon {width: 1.302vw; height: 1.302vw; margin-right: 0.52vw; border-radius: 0.13vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon::before {background-size: 0.781vw;}

    /* layerpopup (layerpopup-webstore-voucher) */
    .layerpopup-webstore-voucher .layer-header .main-tit > * {font-size: 6.51vw;}
    .layerpopup-webstore-voucher .layer-header .main-tit .bold {font-size: 3.906vw;}
    .layerpopup-webstore-voucher .layer-header .sub-tit {font-size: 1.823vw;}
    .layerpopup-webstore-voucher .layer-contents {margin-bottom: 2.205vw;}
    .layerpopup-webstore-voucher .img-area::before {height: 37.723vw;}
    .layerpopup-webstore-voucher .img-area .coupon {width: 33.203vw; height: 19.531vw;}    
    .layerpopup-webstore-voucher .img-area .coupon::before,
    .layerpopup-webstore-voucher .img-area .coupon::after {left: -0.1vw;}
    .layerpopup-webstore-voucher .img-area .coupon img {width: 31.5vw; margin-top: 0.5vw; margin-left: -0.1vw;}
    .layerpopup-webstore-voucher .content {margin: 0.301vw 0 1.723vw;}    
    .layerpopup-webstore-voucher .timer-area {width: 17.057vw; height: 3.385vw; padding: 0 1.977vw 0 4.6875vw; border-width: 0.2604vw; border-radius: 1.953vw; font-size: 1.953vw; box-shadow: 0 0.326vw 0.391vw 0 rgba(0, 0, 0, 0.35);}
    .layerpopup-webstore-voucher .timer-area::before {left: -0.55vw; width: 4.6875vw; height: 5.208vw;}

    /* layerpopup (layerpopup-promo-top10-purchase) */
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] {border-width: 0.26vw; border-radius: 1.302vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li {height: 4.232vw; border-width: 0.13vw; font-size: 2.214vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li:last-child {font-size: 1.5625vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon {margin-right: 0.456vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon img {width: 3.255vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .tit {width: 11.5vw;}
    .layerpopup-promo-top10-purchase .layer-contents .notice {font-size: 1.302vw;}

    /* layerpopup (layerpopup-promo-top20-purchase) */
    .layerpopup-promo-top20-purchase .layer-wrapper {width: 54.948vw;}
    .layerpopup-promo-top20-purchase .layer-contents .cont {font-size: 1.5625vw;}
    .layerpopup-promo-top20-purchase .layer-contents .notice {font-size: 1.5625vw; letter-spacing: -0.05vw;}
}

/* 
 *  [해상도 ~ 480px]
 *  - 모바일 (최소 360px까지)
 *  - 360 기준 / DPR 3 / 3.6
 *  - 모바일 ui 적용 (mode-mobile)
 */
@media all and (max-width:480px) {
    /* layerpopup (common) */
    [class*=layerpopup-common] .layer-wrapper {width: 75.926vw !important; border-width: 0.556vw; border-radius: 3.704vw;}
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close {top: 3.148vw; right: 3.148vw; width: 7.222vw; height: 7.222vw;}
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::before,
    [class*=layerpopup-common] .layer-wrapper > .button-layerpopup-close::after {width: 10.212vw; height: 0.8vw; border-radius: 4vw;}
    [class*=layerpopup-common] .layer-inner {padding: 5.556vw 0;}    
    [class*=layerpopup-common] .layer-inner > *, 
    [class*=layerpopup-common] .layer-contents > * {margin-bottom: 3.704vw;}
    [class*=layerpopup-common] .layer-header {margin-bottom: 1.852vw;}
    [class*=layerpopup-common] .layer-header .main-tit {font-size: 7.407vw;} 
    [class*=layerpopup-common] .layer-header .sub-tit {margin-top: 1.852vw; font-size: 3.333vw;} 
    [class*=layerpopup-common] .layer-contents {padding: 0 2.315vw;} 
    [class*=layerpopup-common] .layer-contents.inner-pd,
    [class*=layerpopup-common] .layer-contents .inner-pd {width: calc(100% - 9.259vw) !important; margin: 0 auto 3.704vw;}
    [class*=layerpopup-common] .layer-contents .content {font-size: 3.333vw !important; letter-spacing: .1vw !important;}
    [class*=layerpopup-common] .layer-contents .infobox {padding: 0 1.852vw; border-radius: 1.667vw; border-width: 0.37vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area {height: 11.111vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area > * {margin-right: 0.9259vw;;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-img {width: 5.556vw; height: 5.741vw;}
    [class*=layerpopup-common] .layer-contents .infobox .chip-info-area .chip-amount {max-width: calc(100% - 6.481vw); font-size: 5.556vw;}    
    [class*=layerpopup-common] .layer-contents .infobox.type-list {padding: 2.315vw 2.778vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list > * {margin-bottom: 2.778vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .title {font-size: 2.963vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .item {padding-left: 1.852vw; margin-bottom: 1.852vw; font-size: 2.593vw;}
    [class*=layerpopup-common] .layer-contents .infobox.type-list .item::before {width: 0.741vw; height: 0.741vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons {padding-top: 1.389vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item {flex: 0 0 calc(20% - 1.111vw); height: 11.111vw; padding: 0; margin-right: 1.389vw; margin-bottom: 1.389vw; border-width: 0.37vw; border-radius: 1.852vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon {margin-top: -0.13vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .icon img {top: 0.301vw;}
    [class*=layerpopup-common] .layer-contents .infobox-wrap .gift-icons .item .cnt {font-size: 2.593vw;}
    [class*=layerpopup-common] .layer-contents .notice {font-size: 3.333vw;}    
    [class*=layerpopup-common] .layer-contents .circle-gauge {margin-top: 1.852vw;} 
    [class*=layerpopup-common] .layer-footer .btn-complete {width: 40.741vw; height: 9.259vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-back,
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-front {height: 8.611vw; border-radius: 4.444vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .bg-back {top: 0.648vw;}    
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner {left: 0.278vw; top: 0.278vw; width: calc(100% - 0.556vw); height: calc(100% - 0.556vw); border-radius: 4.444vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before,
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {left: 0.278vw; width: calc(100% - 0.556vw); height: calc(50% - 0.278vw);}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::before {top: 0.278vw; border-radius: 46.296vw 46.296vw 0 0;}
    [class*=layerpopup-common] .layer-footer .btn-complete .front-inner::after {bottom: 0.278vw; border-radius: 0 0 46.296vw 46.296vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt {font-size: 4.444vw;}
    [class*=layerpopup-common] .layer-footer .btn-complete .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.278vw; -moz-text-stroke-width: 0.278vw; -ms-text-stroke-width: 0.278vw; text-stroke-width: 0.278vw;}
    [class*=layerpopup-common] .layer-wrapper.over-visible .layer-top-area {border-radius:3.5vw 3.5vw 0 0;} 
    [class*=layerpopup-common] .layer-wrapper.over-visible .layer-inner {border-radius: 3.5vw;}     
    [class*=layerpopup-common] .layer-wrapper.half-bg .layer-top-area {height: 41.667vw; border-width: 0.556vw;}
    [class*=layerpopup-common] .layer-wrapper.half-bg .layer-inner {padding-top: 4.63vw; border-radius: 0 0 3.5vw 3.5vw;}
    [class*=layerpopup-common] .layer-wrapper.half-bg .layer-inner .content {font-size: 2.593vw !important;}
    [class*=layerpopup-common].type-toast .layer-wrapper {position: absolute; left: 0; bottom: 0; width: 100% !important; max-width: 100% !important; border-bottom-left-radius: 0; border-bottom-right-radius: 0; animation: showLayerFromBottom .8s ease forwards;}

    /* layerpopup (common) : vip */
    [class*=layerpopup-common][class*=layerpopup-vip] .layer-wrapper {width: 92.593vw !important;}
    [class*=layerpopup-common][class*=layerpopup-vip] .layer-header .sub-tit {font-size: 3.704vw;}

    /* layerpopup-full (common) */
    [class*=layerpopup-full-common] .layer-wrapper {width: 100%;}
    [class*=layerpopup-full-common] .button-layerpopup-close {top: 3.704vw; right: 4.167vw; width: 7.222vw; height: 7.222vw;}
    [class*=layerpopup-full-common] .button-layerpopup-close::before,
    [class*=layerpopup-full-common] .button-layerpopup-close::after {width: 10.212vw; height: 0.8vw; border-radius: 4vw;}

    /* layerpopup (side) */
    [class*=layerpopup-side] .layer-inner {width: 100%;}
    [class*=layerpopup-side] .button-layerpopup-close {top: 3.704vw; width: 7.222vw; height: 7.222vw;}
    [class*=layerpopup-side] .button-layerpopup-close::before,
    [class*=layerpopup-side] .button-layerpopup-close::after {width: 10.212vw; height: 0.8vw; border-radius: 4vw;}
    [class*=layerpopup-side] * {font-size: 1.5625vw;}
    .layerpopup-side-left .button-layerpopup-close {left: 4.167vw;}
    .layerpopup-side-right .button-layerpopup-close {right: 4.167vw;}

    /* layerpopup (mo-menu-comm) */
    .mo-menu-comm .layer-inner {padding: 14.815vw 3.704vw 0;}
    .mo-menu-comm .layer-inner::before {top: 14.815vw; height: 0.556vw;}
    .mo-menu-comm .menu-area {margin: 12.963vw 0;}
    .mo-menu-comm .menu-area .menu-item > a {height: 18.519vw; padding: 0 3.704vw; font-size: 7.407vw;}

    /* layerpopup (gnb) */
    .layerpopup-gnb .menu-area .lnb {margin-bottom: 9.259vw;}
    .layerpopup-gnb .menu-area .lnb .lnb-item {padding: 0 3.704vw;}
    .layerpopup-gnb .menu-area .lnb .lnb-item > a {height: 12.963vw; padding: 0 3.704vw; font-size: 4.63vw;}
    .layerpopup-gnb .menu-area .gnb-item.has-depth > a::after {right: 2.604vw; width: 3.333vw; height: 1.852vw;}
    .layerpopup-gnb .bottom-area {padding: 9.259vw 0; border-width: 0.37vw;}
    .layerpopup-gnb .bottom-area > * {margin-bottom: 7.407vw;}
    .layerpopup-gnb .btn-play {width: 61.852vw; height: 14.444vw;}
    .layerpopup-gnb .btn-play .bg-back,
    .layerpopup-gnb .btn-play .bg-front {height: 13.519vw; border-radius: 7.407vw;}
    .layerpopup-gnb .btn-play .bg-back {top: 0.926vw; box-shadow: 0 0.463vw 0.37vw 0 rgba(0, 0, 0, 0.30);}
    .layerpopup-gnb .btn-play .front-inner {left: 0.37vw; top: 0.37vw; width: calc(100% - 0.391vw); height: calc(100% - 0.391vw); border-radius: 7.407vw;}
    .layerpopup-gnb .btn-play .front-inner::before,
    .layerpopup-gnb .btn-play .front-inner::after {left: 0.37vw; width: calc(100% - 0.741vw); height: calc(50% - 0.37vw);}
    .layerpopup-gnb .btn-play .front-inner::before {top: 0.37vw; border-radius: 59.907vw 59.907vw 0 0; }
    .layerpopup-gnb .btn-play .front-inner::after {bottom: 0.37vw; border-radius: 0 0 59.907vw 59.907vw;}
    .layerpopup-gnb .btn-play .txt-area .txt {font-size: 7.407vw;}
    .layerpopup-gnb .btn-play .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.741vw; -moz-text-stroke-width: 0.741vw; -ms-text-stroke-width: 0.741vw; text-stroke-width: 0.741vw;}
    .layerpopup-gnb .sns-btns-comm [class*=btn-item] {width: 8.519vw; height: 8.519vw; margin: 0 4.63vw;}

    /* layerpopup (terms-menu) */ 
    .layerpopup-terms-menu .menu-area .menu-item > a {font-size: 7.037vw;} 

    /* layerpopup (profile) */
    .layerpopup-profile .profile-area .user-info {padding: 5.556vw 2.778vw;}
    .layerpopup-profile .profile-area .user-info > * {margin-bottom: 3.704vw;}
    .layerpopup-profile .profile-area .user-info .thumb {width: 12.037vw; height: 12.037vw;}
    .layerpopup-profile .profile-area .user-info .name {font-size: 5.556vw;}
    .layerpopup-profile .profile-area .user-info .id {min-width: 27.778vw; height: 5.556vw; padding: 0 3.704vw; border-radius: 3.704vw; font-size: 3.148vw;}
    .layerpopup-profile .profile-area .chip-info,
    .layerpopup-profile .profile-area .vip-info {min-height: 18.519vw; padding: 4.63vw 3.704vw;}    
    .layerpopup-profile .profile-area .chip-info .amount {padding-left: 10.556vw; font-size: 7.407vw;}    
    .layerpopup-profile .profile-area .chip-info .amount::before {width: 7.778vw; height: 7.963vw; margin-top: 0.25vw;}
    .layerpopup-profile .profile-area .vip-info > * {margin-right: 7.407vw;}
    .layerpopup-profile .profile-area .vip-info .lv-name {font-size: 4.63vw;}
    .layerpopup-profile .profile-area .vip-info .card-img {margin-left: 1.574vw; width: 9.444vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar {min-width: 31.296vw; padding: 0 3.704vw 0 5.185vw; height: 5.556vw; border-radius: 3.704vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar::before {left: -1.296vw; width: 6.481vw; height: 6.481vw;}
    .layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info, 
    .layerpopup-profile .profile-area .vip-info .gauge-bar .gauge-info * {font-size:  3.148vw;}
    .layerpopup-profile .bottom-area {padding: 5.556vw 0;}
    .layerpopup-profile .bottom-area .button-logout > .txt {font-size: 4.63vw;}

    /* layerpopup (login-prompt-comm) */
    .layerpopup-login-prompt-comm .layer-top-area .img-main {width: 45vw; margin-top: -14.815vw;}

    /* layerpopup (login-prompt) */
    .layerpopup-login-prompt .layer-top-area .img-main {width: 37.037vw; margin-top: -11.852vw; margin-bottom: 1.852vw;}
    .layerpopup-login-prompt .layer-header {margin-bottom: 3.704vw;}    
    .layerpopup-login-prompt .layer-header .main-tit {font-size: 4.0741vw;}
    .layerpopup-login-prompt .layer-contents .notice {margin-bottom: 1.852vw !important; font-size: 2.963vw !important;}
    .layerpopup-login-prompt .layer-contents .notice:nth-of-type(2) {font-size: 2.593vw !important;}

    /* layerpopup (pw-reset-complete) */
    .layerpopup-pw-reset-complete .layer-top-area .img-main {width: 44.444vw; margin-top: -10.833vw;}

    /* layerpopup (account-create-complete) */
    .layerpopup-account-create-complete .layer-top-area .img-main {width: 39.444vw; margin-top: -11.667vw;}
    .layerpopup-account-create-complete .layer-header {margin-bottom: 3.704vw;}

    /* layerpopup (email-sent-complete) */
    .layerpopup-email-sent-complete .layer-top-area .img-main {width: 62.593vw; margin-top: -14.815vw; margin-left: -2.315vw;}

    /* layerpopup (weblogin-blocked) */
    .layerpopup-weblogin-blocked .layer-top-area .img-main {width: 35.833vw; margin-top: -11.667vw;}
    .layerpopup-weblogin-blocked .layer-contents .qr-img {width: 17.407vw;}

    /* layerpopup (levelup-reward)*/
    /* .layerpopup-levelup-reward .layer-contents {margin-bottom: 1vw !important;} */

    /* layerpopup (doubleupoint-levelup) */
    .layerpopup-doubleupoint-levelup .layer-contents {padding: 0;}

    /* layerpopup (payment-complete) */
    .layerpopup-payment-complete .layer-contents .content {font-size: 2.963vw !important;}
    .layerpopup-payment-complete .content-ui > * {margin-bottom: 3.704vw;}

    /* layerpopup (vip-open) */
    .layerpopup-vip-open .layer-top-area .img-main {width: 42.963vw; margin-top: -7.87vw;}
    .layerpopup-vip-open .layer-contents .item-list .item {flex: 1 0 calc(50% - 1.852vw); height: 38.889vw; padding-top: 0.391vw; margin: 0 3.704vw 3.704vw 0; border-width: 0.37vw; border-radius: 1.852vw;}
    .layerpopup-vip-open .layer-contents .item-list .item .content-area .title {font-size: 4.444vw;}
    .layerpopup-vip-open .layer-contents .item-list .item .content-area .description {margin-top: 0.926vw; font-size: 2.593vw;}

    /* layerpopup (vip-levelup) */
    .layerpopup-vip-levelup .layer-top-area .img-main {padding-bottom: 0.602vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::before,
    .layerpopup-vip-levelup .layer-top-area .img-main::after {top: 12.593vw; width: 12.222vw; height: 6.759vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::before {left: -8.981vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main::after {right: -8.148vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main .img::before {bottom: -1.302vw; width: 35.741vw; height: 5.463vw;}
    .layerpopup-vip-levelup .layer-top-area .img-main img {height: 17.685vw;}

    /* layerpopup (upsell-unavailable) */
    .layerpopup-upsell-unavailable .layer-top-area .img-main {width: 45.185vw; margin-top: -10.926vw;}

    /* layerpopup (doubleupoint) */
    .layerpopup-doubleupoint .top-banner {height: 65.556vw;}
    .layerpopup-doubleupoint .top-banner .inner-box {padding: 5.556vw 2.778vw 0;}
    .layerpopup-doubleupoint .top-banner .inner-box > * {margin-bottom: 2.778vw;}
    .layerpopup-doubleupoint .top-banner .inner-box .title {font-size: 10.37vw;}
    .layerpopup-doubleupoint .top-banner .inner-box .desc {font-size: 3.148vw;}
    .layerpopup-doubleupoint .point-area-comm .point-title .title {margin-bottom: 3.704vw;}
    .layerpopup-doubleupoint .reward-area {padding: 7.407vw 0;}
    .layerpopup-doubleupoint .reward-list > .item {margin-bottom: 3.704vw;}
    .layerpopup-doubleupoint .reward-list .level-wrap {width: 29.074vw; height: 29.074vw;}
    .layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm {width: 15.185vw; height: 15.185vw; margin-top: 0;}
    .layerpopup-doubleupoint .reward-list .level-wrap .icon-level-comm .num {line-height: 15.185vw; font-size: 4.63vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap {width: 60.741vw; height: 33.796vw; margin-left: 2.778vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set-box {width: calc(100% - 3.148vw); padding-left: 2.777vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set-box .set {width: 12.407vw; height: 12.407vw; padding-top: 0.926vw; margin-right: 1.111vw; border-radius: 2.593vw; border-width: 0.556vw;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set img {width: 85%;}
    .layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area {bottom: 1vw;} 
    .layerpopup-doubleupoint .reward-list .reward-wrap .set .txt-area .txt {font-size: 2.778vw;}
    .layerpopup-doubleupoint .btn-claim {width: 36.111vw; height: 9.259vw;}
    .layerpopup-doubleupoint .btn-claim .bg-back,
    .layerpopup-doubleupoint .btn-claim .bg-front {height: 8.611vw; border-radius: 4.444vw;}
    .layerpopup-doubleupoint .btn-claim .bg-back {top: 0.648vw;}
    .layerpopup-doubleupoint .btn-claim .front-inner {left: 0.278vw; top: 0.278vw; width: calc(100% - 0.556vw); height: calc(100% - 0.556vw); border-radius: 4.444vw;}
    .layerpopup-doubleupoint .btn-claim .front-inner::before,
    .layerpopup-doubleupoint .btn-claim .front-inner::after {left: 0.278vw; width: calc(100% - 0.556vw); height: calc(50% - 0.556vw);}
    .layerpopup-doubleupoint .btn-claim .front-inner::before {top: 0.556vw; border-radius: 46.296vw 46.296vw 0 0;}
    .layerpopup-doubleupoint .btn-claim .front-inner::after {bottom: 0.556vw; border-radius: 0 0 46.296vw 46.296vw;}
    .layerpopup-doubleupoint .btn-claim .txt-area .txt {font-size: 4.444vw;}
    .layerpopup-doubleupoint .btn-claim .txt-area .txt:nth-child(1) {-webkit-text-stroke-width: 0.556vw; -moz-text-stroke-width: 0.556vw; -ms-text-stroke-width: 0.556vw; text-stroke-width: 0.556vw;}
    .layerpopup-doubleupoint .claimed-text {font-size: 4.444vw;}
    .layerpopup-doubleupoint .reward-list > .item.unlock .reward-wrap::after {right: -2.315vw; top: -2.222vw; width: 8.333vw; height: 10.185vw;}

    /* layerpopup (promotion-login-bonus) */
    .layerpopup-login-bonus .layer-top-area .img-main {width: 76.111vw; margin-top: -3.333vw; margin-left: 1.944vw;}

    /* layerpopup (promotion-benefit-guide) */
    .layerpopup-promotion-benefit-guide .layer-top-area .img-main {width: 80.185vw; margin-top: -24.6296vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area {margin-top: 3.704vw; font-size: 3.333vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon {width: 4.63vw; height: 4.63vw; margin-right: 1.852vw;}
    .layerpopup-promotion-benefit-guide .layer-footer .checkbox-area input[type=checkbox] + label .icon::before {background-size: 2.8vw;}

    /* layerpopup (layerpopup-webstore-voucher) */
    .layerpopup-webstore-voucher .layer-header .main-tit > * {font-size: 11.111vw;}
    .layerpopup-webstore-voucher .layer-header .main-tit .bold {font-size: 7.407vw;}
    .layerpopup-webstore-voucher .layer-header .sub-tit {margin-top: 1vw; font-size: 3.704vw;}
    .layerpopup-webstore-voucher .layer-contents {margin-bottom: 4.63vw;}
    .layerpopup-webstore-voucher .img-area::before {height: 55vw;}
    .layerpopup-webstore-voucher .img-area .coupon {width: 64.444vw; height: 37.87vw;}    
    .layerpopup-webstore-voucher .img-area .coupon::before,
    .layerpopup-webstore-voucher .img-area .coupon::after {left: -0.1vw;}
    .layerpopup-webstore-voucher .img-area .coupon img {width: 61.5vw; margin-top: 2vw; margin-left: -0.1vw;}
    .layerpopup-webstore-voucher .content {margin: 0.301vw 0 2.778vw;}    
    .layerpopup-webstore-voucher .timer-area {width: 36.667vw; height: 7.407vw; padding: 0 5.556vw 0 9.259vw; border-width: 0.556vw; border-radius: 3.704vw; font-size: 4.074vw; box-shadow: 0 0.694vw 0.833vw 0 rgba(0, 0, 0, 0.35);}
    .layerpopup-webstore-voucher .timer-area::before {left: -0.741vw; width: 10vw; height: 11.111vw;}

    /* layerpopup (layerpopup-promo-top10-purchase) */
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] {border-width: 0.37vw; border-radius: 1.852vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li {height: 7.407vw; border-width: 0.37vw; font-size: 3.704vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li:last-child {font-size: 2.593vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon {margin-right: 1.296vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .icon img {width: 5.926vw;}
    .layerpopup-promo-top10-purchase .layer-contents > [class*=infobox] .info-list > li .tit {width: 20.5vw;}
    .layerpopup-promo-top10-purchase .layer-contents .notice {font-size: 2.222vw;}
    .layerpopup-promo-top10-purchase .layer-contents .notice .bold {display: block; margin-top: 0.926vw; font-size: 2.593vw;}

    /* layerpopup (layerpopup-promo-top20-purchase) */
    .layerpopup-promo-top20-purchase .layer-wrapper {width: 92.593vw !important;}
    .layerpopup-promo-top20-purchase .layer-header .sub-tit,
    .layerpopup-promo-top20-purchase .layer-contents .cont,
    .layerpopup-promo-top20-purchase .layer-contents .notice {font-size: 2.593vw;}
    .layerpopup-promo-top20-purchase .layer-contents .cont {line-height: 1.6;}
}