@charset "utf-8";

* {font-family: 'Noto Sans KR' !important;}
body{-ms-overflow-style: none;}
::-webkit-scrollbar {display: none;}

#selectPaymentPop.layerWrap .layerBox.yogoPricing {width: 780px;}
.layerBox.yogoPricing * {color: #000;}
/* yogoReset - yogoHeader */
#selectPaymentPop.layerWrap .layerBox.yogoPricing .layerHeader {height: 100px !important; position: fixed; top: 0; right: 0; left: 0; background-color: #fff; z-index: 10; display:flex; align-items: center; padding: 36px 40px !important; border-bottom: 1px solid #D9D9D9; border-radius: 0; box-sizing: border-box;}
#selectPaymentPop.layerWrap .layerBox.yogoPricing .layerHeader .layerTit {height:auto; line-height:normal; font-size: 24px; font-weight: bold; padding: 0; display: inline-block !important;}
.layerBox.yogoPricing .layerHeader img {width: auto; height: auto; margin: 2px 0 0 8px;}

/* yogoReset - yogoBody */
#selectPaymentPop.layerWrap .layerBox.yogoPricing .layerBody {height: auto; padding: 100px 0 14vh; overflow-y: auto; overflow-x: hidden; box-sizing: border-box; margin: 0;}
#selectPaymentPop.layerWrap .layerBox.yogoPricing .layerBody.expNotice {padding-bottom: 80px;}
#selectPaymentPop.layerWrap .layerBox.yogoPricing .layerBody.exp {padding-bottom: 24vh;}

#selectPaymentPop.layerWrap .layerBox.yogoPricing .chargeListWrap {margin: 0;}
#selectPaymentPop.layerWrap .layerBox.yogoPricing .plan-direct {padding-top: 0;}

#selectPaymentPop.layerWrap .layerBox.yogoPricing .layerFoot  {display: none;}

#selectPaymentPop.layerWrap .layerBox.yogoPricing .btnLayerClose {position: absolute; right: 36px; top: 38px; width: 24px; height: 24px; background: url(/unify/pc/images/yogo/yogo_btn_layer_close.png) no-repeat center; background-size: 24px auto; z-index: 10; border: 0;}

/* yogoReset */
.yogoPricingWrap button,
.yogoPricingWrap input,
.yogoPricingWrap select,
.yogoPricingWrap table,
.yogoPricingWrap textarea {-webkit-font-smoothing: subpixel-antialiased;}
.yogoPricingWrap *:focus {outline: rgba(0, 0, 0, 0.7) dashed 1px !important;}

/* common - title - toggle */
.yogoPricingWrap .yTitle {display: flex; justify-content: space-between; align-items: center;}
.yogoPricingWrap .yTitle .tit {width: calc(100% - 34px); font-size: 12px; font-weight: 500;}
.yogoPricingWrap .yTitle button {position: relative; display: block; width: 100%; height: 24px; text-align: left; padding-right: 24px;}
.yogoPricingWrap .yTitle button span {font-size: 14px; font-weight: 500; letter-spacing: -0.5px;}
.yogoPricingWrap .yTitle button::after {content: ''; position: absolute; top: 50%; right: 0; width: 24px; height: 24px; background: url(/unify/pc/images/yogo/yogo_toggle_up_arrow.svg) no-repeat 50% 50%; background-size: 16px auto; transition: transform 0.5s ease; transform: translateY(-50%) rotate(180deg);}
.yogoPricingWrap .yTitle button[aria-expanded=true]:after {transform: translateY(-50%) rotate(0);}
.yogoPricingWrap .yTitle .tit + button {width: 24px; padding-right: 0;}

/* yogoPricingBlock */
.yogoPricingWrap .yogoPricingBlock {position: relative; margin: 0 -40px; padding: 20px 16px 33px;
    background: #F0F3FA;
    background: linear-gradient(90deg,rgba(240, 243, 250, 1) 0%, rgba(241, 243, 250, 0.8) 30%, rgba(253, 242, 240, 1) 100%);
}

/* yogoPricingBlock - yogoSwitch */
.yogoPricingWrap .yogoSwitchWrap {position: relative; text-align: center; z-index: 1;}
.yogoPricingWrap .yogoSwitchWrap .yogoSwitch {position: relative !important; width: 332px; height: 40px; appearance: none;}

.yogoPricingWrap .yogoSwitch::before {content: ''; position: absolute; top: 3px; left: 4px; width: calc(50% - 6px); height: 32px; border-radius: 20px; transition: transform .2s linear; z-index: 1; transform: translateX(0); background-color: #fff; border: #000 solid 2px; z-index: 1; -webkit-box-shadow:  0 0 4px #fff; box-shadow: 0 0 4px #fff;}
.yogoPricingWrap .yogoSwitch::after {content: ""; position: absolute; border-radius: 100px; width: 100%; height: 100%; background: #fff; border: 1px solid #D9D9D9;}
.yogoPricingWrap .yogoSwitch:checked::before {transform: translateX(calc(100% - 2px));}
.yogoPricingWrap .yogoSwitch:disabled {cursor: not-allowed; background-color: #d3d3d3 !important}
.yogoPricingWrap .yogoSwitch:disabled::before {opacity: 0.5 !important}

.yogoPricingWrap .yogoSwitch +.lb {position: absolute; display: flex; left: 50%; top: 0; transform: translateX(-50%); width: 332px; height: 40px; /*gap: 20px;*/ padding: 0; justify-content: space-around; align-items: center; outline: none; background: none !important; background-position: 50% 50%; z-index: 1;}
.yogoPricingWrap .yogoSwitch +.lb:before {display: none;}
.yogoPricingWrap .yogoSwitch +.lb .txt {flex: 1; display: inline-flex; justify-content: center; align-items: center; height: 100%; font-size: 14px; line-height: 24px; letter-spacing: -0.8px; transition: color 0.3s}
.yogoPricingWrap .yogoSwitch +.lb .txt.data {padding-right: 0;}
.yogoPricingWrap .yogoSwitch +.lb .txt.month {padding-left: 0;}
.yogoPricingWrap .yogoSwitch +.lb .txt,
.yogoPricingWrap .yogoSwitch:checked+.lb .txt.data {font-weight: normal; color: #525252;}
.yogoPricingWrap .yogoSwitch +.lb .txt.data,
.yogoPricingWrap .yogoSwitch:checked +.lb .txt.month {font-weight: bold; color: #000;}
.yogoPricingWrap .yogoSwitch:disabled +.lb .txt {opacity: 0.5 !important; cursor: not-allowed}

/* yogoPricingBlock - yogoSlide */
.yogoPricingWrap .yogoSwiper {position: relative; width: 50%; margin: 20px auto 0; overflow: hidden; z-index: 1;}
.yogoPricingWrap .yogoSwiper .swiper-slide dl {padding: 0 30px; text-align: center;}
.yogoPricingWrap .yogoSwiper .swiper-slide dt {font-size: 24px; font-weight: bold;}
.yogoPricingWrap .yogoSwiper .swiper-slide dd {margin-top: 5px; font-size: 12px;}

.yogoPricingWrap .yogoSwiper .swiper-button-next,
.yogoPricingWrap .yogoSwiper .swiper-button-prev {width: 32px; height: 32px; margin-top: -16px;}
.yogoPricingWrap .yogoSwiper .swiper-button-next {right: 0;}
.yogoPricingWrap .yogoSwiper .swiper-button-prev {left: 0;}
.yogoPricingWrap .yogoSwiper .swiper-button-next:after,
.yogoPricingWrap .yogoSwiper .swiper-button-prev:after {content: ''; width: 28px; height: 28px; background: #fff url(/unify/pc/images/yogo/yogo_swiper_arrow.svg) no-repeat 50% 50%; border-radius: 50%; background-size: 14px auto; border: 1px solid #D9D9D9; border-radius: 50%; -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);}
.yogoPricingWrap .yogoSwiper .swiper-button-prev:after {transform: rotate(-180deg); -webkit-box-shadow: 0px -4px 8px rgba(0, 0, 0, 0.1);}
.yogoPricingWrap .yogoSwiper .swiper-button-next.swiper-button-disabled,
.yogoPricingWrap .yogoSwiper .swiper-button-prev.swiper-button-disabled {opacity: 0.6;}

.swiper-notification {display:none;}

/* yogoYdata Check */
.yogoPricingWrap .yogoYdata {position: relative; margin-top: 20px; padding: 15px 20px 16px; border:1px solid #BBEBEA; border-radius: 8px; background-color: #F0FBFC;}
.yogoPricingWrap .yogoYdata input {position: absolute; top: 18px; left: 18px; width: 20px; height: 20px;}
.yogoPricingWrap .yogoYdata input:focus {outline: none !important;}
.yogoPricingWrap .yogoYdata label {padding-left: 32px; background: url(/unify/pc/images/yogo/yogo_icon_check_off.svg) 0 50% no-repeat; background-size: 20px auto; font-size: 16px; font-weight: bold; color: #000; cursor: pointer;}
.yogoPricingWrap .yogoYdata input:checked + label {color: #000; background-image: url(/unify/pc/images/yogo/yogo_icon_check_on.svg);}

/* yogoPlanArea */
.yogoPricingWrap .yogoPlanArea {margin-top: 20px;}

/* yogoPlanArea - yogoPricingList */
.yogoPricingWrap .yogoPricingList > li + li {margin-top: 12px;}

/* yogoPlanArea - yogoPricingList - yogoItem */
.yogoPricingWrap .yogoItem {position: relative; padding: 20px 10px;}
.yogoPricingWrap .yogoItem::before {content: ''; position: absolute; top: 0; left: 0; width: calc(100% - 2px); height: calc(100% - 2px); border: 1px solid #D9D9D9; border-radius: 8px; z-index: -1;}
.yogoPricingWrap .yogoItem.on {opacity: 1;}
.yogoPricingWrap .yogoItem.onG {opacity: 0.7;}
.yogoPricingWrap .yogoItem.on::before {width: calc(100% - 4px); height: calc(100% - 4px); border-width: 2px; border-color: #000;
    -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

/* yogoPlanArea - yogoPricingList - yogoItem - yogoName */
.yogoPricingWrap .yogoName {display: flex; justify-content: space-between; align-items: center; cursor: pointer; min-height: 20px; margin: 0 10px; padding-left: 26px; background: url(/unify/pc/images/yogo/yogo_radio_off.svg) no-repeat 0 2px; background-size: 20px auto; flex-wrap: wrap}
.yogoPricingWrap .yogoItem.on .yogoName {background-image: url(/unify/pc/images/yogo/yogo_radio_on.svg);}

.yogoPricingWrap .yogoName .tit {display: flex; align-items: center; font-size: 16px; font-weight: bold;}
.yogoPricingWrap .yogoName .tit img {margin-left: 6px; width: auto; height: 18px;}
.yogoPricingWrap .yogoName .price {font-weight: bold;}

/* yogoPlanArea - yogoPricingList - yogoItem - yogoData */
.yogoPricingWrap .yogoData {padding: 16px 0 0; border-top: 1px solid #EDEDED; margin: 16px 0 0 -26px; width: calc(100% + 26px)}
.yogoPricingWrap .yogoData .tit {font-size: 18px; font-weight: bold;}
.yogoPricingWrap .yogoData span {display: none; margin-left: 4px;}
.yogoPricingWrap .yogoData .ydY {color: #11A8A3;}
.yogoPricingWrap .yogoData .ydA {color: #EA3037;}

.yogoPricingWrap .yogoDataPlan {margin-top: 2px; display: flex; align-items: center;}
.yogoPricingWrap .yogoDataPlan li {position: relative; font-size: 14px; font-weight: 500;}
.yogoPricingWrap .yogoDataPlan li + li {margin-left: 4px; padding-left: 4px;}
.yogoPricingWrap .yogoDataPlan li + li::before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 1px; height: 8px; background-color: #70707030;}
.yogoPricingWrap .yogoDataPlan li strong {font-weight: 500;}

/* yogoPlanArea - yogoPricingList - yogoItem - yogoBenefitArea */
.yogoPricingWrap .yogoBenefitArea {display:none; margin: 16px -8px 0; padding: 12px 10px 0; border-top: 1px solid #EDEDED;}
.yogoPricingWrap .yogoBenefitArea + .yogoBenefitArea {margin-top: 4px; border-top: 0;}
.yogoPricingWrap .yogoItem.on .yogoBenefitArea {display: block;}
.yogoPricingWrap .yogoItem.on .yogoBenefitToggle {display: none;}

.yogoPricingWrap .yogoItem.yogoItemFree.on .yogoBenefitArea {display: none;}
.yogoPricingWrap .yogoItem.yogoItemFree.on .yogoBenefitToggle {display: block;}

.yogoPricingWrap .yogoBenefitArea > .tit {margin-bottom: 7px; padding: 0 10px; font-size: 14px; font-weight: bold;}
.yogoPricingWrap .yogoBenefitArea > .tit span {display: inline-block; letter-spacing: -0.5px;}

.yogoPricingWrap .ybaList {padding: 8px; border-radius: 4px;
    background: #F0F3FA;
    background: linear-gradient(90deg,rgba(240, 243, 250, 1) 6.4%, rgba(241, 243, 250, 0.8) 34.75%, rgba(253, 242, 240, 1) 100%);
}
.yogoPricingWrap .ybaList .ybaListBlock + .ybaListBlock {margin-top: 12px;}
.yogoPricingWrap .ybaList .ybaListBlock li {display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;}
.yogoPricingWrap .ybaList .ybaListBlock li:last-child {margin-bottom: 0;}
.yogoPricingWrap .ybaList .ybaListBlock li * {font-size: 14px; color: #6A6A6A; font-weight: normal;}
.yogoPricingWrap .ybaList .ybaListBlock li.on * {color: #000;}
/* .yogoPricingWrap .ybaList .ybaListBlock li + li {margin-top: 8px;} */
.yogoPricingWrap .ybaList .ybaListBlock li .img {min-width: 20px; min-height: 20px; margin-right: 8px; background: url(/unify/pc/images/yogo/yogo_icon_plus.svg) no-repeat 50% 0; background-size: 20px auto;}
.yogoPricingWrap .ybaList .ybaListBlock li .img img {width: 100%;}
.yogoPricingWrap .ybaList .ybaListBlock li .img.none {background-image: none;}
.yogoPricingWrap .ybaList .ybaListBlock li .tit {width: 50%;}
.yogoPricingWrap .ybaList .ybaListBlock li .point {width: 68%;}

.yogoPricingWrap .ybaList .ybaListBlock li .tit {margin-right: 6px;}
.yogoPricingWrap .ybaList .ybaListBlock li .point {text-align: right;}
.yogoPricingWrap .ybaList .ybaListBlock li .reload {min-width: 20px; min-height: 20px; margin-left: 8px; background: url(/unify/pc/images/yogo/yogo_icon_reload.svg) no-repeat 50% 0; background-size: 20px auto;}
.yogoPricingWrap .ybaList .ybaListBlock li.on .tit {font-weight: bold;}
.yogoPricingWrap .ybaList .ybaListBlock li.on .point,
.yogoPricingWrap .ybaList .ybaListBlock li.on .point * {font-weight: bold; color: #276DCC;}
.yogoPricingWrap .ybaList .ybaListBlock li.on .point em {font-weight: normal; font-size: 12px; margin-left: 2px; font-style: normal;}
.yogoPricingWrap .ybaList .ybaListBlock li.on .point br {display: none;}
.yogoPricingWrap .ybaList .ybaListBlock li.on .reload {background-image: url(/unify/pc/images/yogo/yogo_icon_reload_on.svg);}
.yogoPricingWrap .ybaList .ybaListBlock li.on .reload:disabled {background-image: none; cursor: default; border: none;}

/* yogoPlanArea - yogoPricingList - yogoItem - yogoBenefitToggle */
.yogoPricingWrap .yogoBenefitToggle {margin: 16px -8px 0; padding: 12px 10px 0; border-top: 1px solid #EDEDED;}
.yogoPricingWrap .yogoBenefitToggle .yTitle {padding: 0 8px 0 10px;}
.yogoPricingWrap .yogoBenefitToggle .yTitle button {height: auto;}
.yogoPricingWrap .yogoBenefitToggle .yTitle button::after {top: 10px;}
.yogoPricingWrap .yogoBenefitToggle .yTitle button span {font-weight: bold;}
.yogoPricingWrap .yogoBenefitArea + .yogoBenefitToggle {margin-top: 16px;}

.yogoPricingWrap .yogoBenefit {margin-top: 13px;}
.yogoPricingWrap .yogoBenefit .ybfList {position: relative; display: flex; align-items: stretch; justify-content: space-between;}
.yogoPricingWrap .yogoBenefit .ybfList > * {flex: 1; width: auto; min-width: 0;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock > .tit {position:relative; margin:0 0 6px 10px; padding-left: 22px; min-height: 16px; display: flex; align-items: center; font-size: 12px; font-weight: bold; letter-spacing: -0.5px;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock > .tit::before {content: ''; position: absolute; top: 0; left: 0; display: block; width: 18px; height: 18px; background: url() no-repeat 0 50%; background-size: 18px auto;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock > .tit.benefit::before {background-image: url(/unify/pc/images/yogo/yogo_icon_benefit.svg);}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock > .tit.point::before {background-image: url(/unify/pc/images/yogo/yogo_icon_point.svg);}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock li {position: relative; display: flex; justify-content: space-between; align-items: center; padding: 0 10px 0 30px;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock li + li {margin-top: 10px;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock li > .tit {font-size: 12px; font-weight: 500;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock .item {display: flex; align-items: center; padding: 0 4px 0 0; margin-left: 6px; background: #F6F5F7; border-radius: 16px;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock .item span + span {margin-left: -10px;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock .item span img {width: 22px; border: 2px solid #F6F5F7; border-radius: 50%;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlock .item span.last {margin-left: -6px; display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; color: #000; font-size: 9px; font-weight: bold; border-radius: 50%;}

.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlockOr {display: inline-flex; align-items: center; justify-content: center; flex: 0 0 40px; width: 40px; min-width: 40px; text-align: center; background-image: repeating-linear-gradient(to bottom, #A8A8A8, #A8A8A8 2px, transparent 2px, transparent 6px); background-size: 2px 100%; background-repeat: no-repeat; background-position: center;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlockOr span {display: inline-block; padding: 6px 2px; background-color: #fff; color: #6A6A6A; font-weight: bold; font-size: 11px;}

.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlockOr + .ybfListBlock > .tit {margin-left: 0;}
.yogoPricingWrap .yogoBenefit .ybfList .ybfListBlockOr + .ybfListBlock li {padding-left: 20px;}

/* yogoReChoice */
.yogoPricingWrap .yogoReChoice {margin: 12px 0; display: none; width: 100%; padding: 13px 5px; text-align: center; border: 1px solid #A8A8A8; border-radius: 8px; font-size: 16px; font-weight: 500;}
.yogoPricingWrap .yogoReChoice span {padding-right: 24px; background: url(/unify/pc/images/yogo/yogo_icon_reload_button.svg) no-repeat 100% calc(50% - -1px); background-size: 20px auto; line-height: 20px;}

/* plan-info-notice as-is*/
.plan-info-txt {margin: 40px 0 10px; font-size: 12px;}
.yogoPricingWrap ~ .plan-info-notice {margin: 40px 0 0; padding-bottom: 80px;}
.plan-info-txt + .plan-info-notice {margin: 10px 0 0;}
.yogoPricingWrap ~ .plan-info-notice .btn-txt {position: relative; display: block; padding: 17px 20px; font-size: 16px; border: 1px solid #EDEDED; border-radius: 8px; color: #000; font-weight: bold;}
.yogoPricingWrap ~ .plan-info-notice .btn-txt:after {content: ''; position: absolute; right: 23px; top: 50%; display: inline-block; width: 16px; height: 16px; background: url(/unify/pc/images/yogo/yogo_toggle_up_arrow.svg) 0 0 / 16px auto no-repeat; transform: rotate(180deg) translateY(8px); margin: 0; transform-origin: 50% 50%;}
.yogoPricingWrap ~ .plan-info-notice .btn-txt.on:after {transform: rotate(0) translateY(-50%);}
.yogoPricingWrap ~ .plan-info-notice .cont {display: none; background-color: #f8f8f8; border-radius: 8px; padding: 16px; margin: 12px 20px 0;}
.yogoPricingWrap ~ .plan-info-notice .txt-desc > ul > li {position: relative; margin-bottom: 8px; padding-left: 9px; font-size: 12px; line-height: 1.5; color: #808080;}
.yogoPricingWrap ~ .plan-info-notice .txt-desc > ul > li:before {content: ''; position: absolute; left: 0; top: 8px; width: 2px; height: 2px; background-color: #808080;}
.yogoPricingWrap ~ .plan-info-notice .txt-desc > ul > li:last-child {margin-bottom: 0;}
.yogoPricingWrap ~ .plan-info-notice .btn-notice {display: flex; align-items: center; justify-content: center; padding-top: 12px; font-size: 14px; letter-spacing: -0.3px; color: #808080; font-size: 12px;}
.yogoPricingWrap ~ .plan-info-notice .btn-notice:after {content: ''; display: inline-block; width: 16px; height: 16px; background: url(/images/directShop/icon_plan_notice.png) 0 0 / 16px auto no-repeat;}

/* yogoPricingChoice(layerPopup) */
.yogoPricingChoice {position: fixed; bottom: -100%; left: 0; width: calc(100% - 80px); padding: 23px 40px 0 40px; overflow: hidden; border-top: 1px solid #EDEDED; border-radius: 20px 20px 0 0; background-color: #fff; z-index: 10; transition: bottom 0.3s ease-in-out; -webkit-box-shadow: 0px -8px 18px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px -8px 18px 0px rgba(0, 0, 0, 0.2);}
/* .yogoPricingChoice::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background-color: #EDEDED;} */
.yogoPricingChoice::after {content: ''; display: block; width: 100%; height: 34px; background-color: transparent;}
.yogoPricingChoice.show {bottom: 0;}

/* 공통 혜택(layerPopup) 영역 */
.yogoPricingChoice .yTitle {position: relative;}
.yogoPricingChoice .yTitle .ypcToggle {position: absolute; top: 6px; right: 0; display: block; width: 100%; height: 100%; text-align: left; padding-right: 0;}
.yogoPricingChoice .yTitle .ypcToggle span {font-size: 12px; font-weight: 500;}
.yogoPricingChoice .yTitle .ypcToggle::after {content: ''; position: absolute; top: 10px; right: 0; width: 24px; height: 24px; background: url(/unify/pc/images/yogo/yogo_toggle_up_arrow.svg) no-repeat 50% 50%; background-size: 20px auto; transition: transform 0.5s ease; transform: translateY(-50%) rotate(0);}
.yogoPricingChoice .yTitle .ypcToggle[aria-expanded=true]:after {transform: translateY(-50%) rotate(180deg);}
/* .yogoPricingChoice .yTitle .tit + button {width: 24px; padding-right: 0;} */

.yogoPricingChoice .yTitle .tit {display: none; font-size: 24px; font-weight: bold;}
.yogoPricingChoice .yTitle .titTop.hide {display: block;}
.yogoPricingChoice .yTitle .titTop.hide span {font-size: 20px;}
.yogoPricingChoice .yTitle .titTop.hide span br {display: none;}
.yogoPricingChoice .yTitle .titTop.hide .icon-tip {display: none;}
.yogoPricingChoice .yTitle .tit > div {width: auto; display: inline-block;}
.yogoPricingChoice .yTitle .tit .titTop br {display: none;}
.yogoPricingChoice .yTitle .tit .titTop .btn {margin-left: 10px;}
.yogoPricingChoice .yTitle .titTop.hide + .titCon {display: none;}
.yogoPricingChoice .yTitle .tit .titCon {display: inline-block; margin-left: 10px;}
.yogoPricingChoice .yTitle [data-id="addPBenefitTit"] .titCon {display: block; margin-left: 0;}
.yogoPricingChoice .yTitle [data-id="addPSubscriptionTit"] .titCon {display: block; margin-left: 0;}
.yogoPricingChoice .yTitle [data-id="addPPointTit"] .titCon {display: block; margin-left: 0;}
.yogoPricingChoice .yTitle .tit .titCon > div + div {margin-top: 2px; }

.yogoPricingChoice .yTitle .tit .btn {position: relative; display: inline-block; height: 18px; margin-top: -3px; overflow: visible; z-index: 1;}
.yogoPricingChoice .yTitle .tit .btn span {position: relative; display: block; height: 100%; padding-right: 20px; font-size: 12px; font-weight: bold; background: url(/unify/pc/images/yogo/yogo_icon_more.svg) no-repeat 100% 50%;}

.yogoPricingChoice .yTitle .tit .titCon .txt {font-size: 14px; font-weight: 500;}
.yogoPricingChoice .yTitle button::after {background-size: 20px auto;}

.yogoPricingChoice .icon-tip {display: inline-block; width: 16px; height: 16px; font-size: 1px; color: transparent; overflow: hidden; border: none; vertical-align: middle; background: url(/unify/pc/images/yogo/yogo_tip.svg) no-repeat center; background-size: 16px auto; margin: -2px 0 0 8px; vertical-align: middle; position: relative; z-index: 1;}

.yogoPricingChoice .ypcArea {display: none; position: relative;}

.yogoPricingChoice button:focus,
.yogoPricingChoice .icon-tip:focus {outline: rgba(0, 0, 0, 0.7) dashed 1px !important;}

/* 공통 혜택(layerPopup) 영역 - swiper */
.yogoPricingChoice .ypcBlock {display: none; margin-top: 34px;}
.yogoPricingChoice .ypcBlock .swiper-wrapper {display: flex; align-items: stretch;}
.yogoPricingChoice .ypcBlock .swiper-wrapper .swiper-slide {display: flex; flex-direction: column; height: auto;}

.yogoPricingChoice .ypcBlock .swiper-controls {margin-top: 12px; display: flex; justify-content: space-between; align-items: center;}
.yogoPricingChoice .ypcBlock .nav-buttons {margin-left: 16px;}
.yogoPricingChoice .ypcBlock .nav-buttons button {background-color: transparent; border: none; width: 32px; height: 32px; cursor: pointer; position: relative;}
.yogoPricingChoice .ypcBlock .nav-buttons button + button {margin-left: 8px;}

.yogoPricingChoice .ypcBlock .btn-prev::after {content: ''; display: inline-block; width: 32px; height: 32px; background: #fff url(/unify/pc/images/yogo/yogo_swiper_arrow.svg) no-repeat 50% 50%; border-radius: 50%; background-size: 15px auto; border: 1px solid #D9D9D9; border-radius: 50%; -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); transform: rotate(-180deg); will-change: transform;}
.yogoPricingChoice .ypcBlock .btn-next::after {content: ''; display: inline-block; width: 32px; height: 32px; background: #fff url(/unify/pc/images/yogo/yogo_swiper_arrow.svg) no-repeat 50% 50%; border-radius: 50%; background-size: 15px auto; border: 1px solid #D9D9D9; border-radius: 50%; -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); will-change: transform; box-sizing: border-box;}

.yogoPricingChoice .ypcBlock .btn-next.swiper-button-disabled,
.yogoPricingChoice .ypcBlock .btn-prev.swiper-button-disabled {opacity: 0.6;}

.yogoPricingChoice .ypcBlock .swiper-scrollbar {position: relative; flex-grow: 1; height: 32px; margin-right: 0; background: transparent;}
.yogoPricingChoice .ypcBlock .swiper-scrollbar::before {content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; height: 2px; border-radius: 2px; background-color: #D9D9D9;}
.yogoPricingChoice .ypcBlock .swiper-scrollbar-drag {position: relative; height: 100%; background: transparent;}
.yogoPricingChoice .ypcBlock .swiper-scrollbar-drag::before {content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; height: 2px; border-radius: 2px; background-color: #000;}
.yogoPricingChoice .ypcBlock .swiper-controls.hidden {display: none !important;}

/* .yogoPricingChoice .ypcBlock .content {overflow: hidden;} */
.yogoPricingChoice .ypcBlock .content .block {position: relative; width: 100%; height: 100%;}
.yogoPricingChoice .ypcBlock .content .block + .block {margin-left: 8px;}

.yogoPricingChoice .ypcBlock .content .block .head {position: absolute; top: -8px; left: 12px; display: flex; justify-content: space-between; align-items: center; width: calc(100% - 20px); z-index: 1;}
.yogoPricingChoice .ypcBlock .content .block .head.noTip {width: auto;}
.yogoPricingChoice .ypcBlock .content .block .head img {margin: 0; width: 36px; filter: drop-shadow(4px 1.5px 2.5px #00000040);}
.yogoPricingChoice .ypcBlock .content .block .head .icon-tip {margin-top: 7px;}
.yogoPricingChoice .ypcBlock .content .block button {position: relative; padding: 37px 12px 10px; width: 100%; height: 100%; height: 76px; background-color: #fff; -webkit-box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.12); box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.12); text-align: left; border-radius: 8px; display: flex; flex-direction: column;}
.yogoPricingChoice .ypcBlock .content .block button::before {content: ''; position: absolute; top: 0; left: 0; width: calc(100% - 2px); height: calc(100% - 2px); border: 1px solid #DEDEDE; border-radius: 8px;}
.yogoPricingChoice .ypcBlock .content .block button.on::before {width: calc(100% - 4px); height: calc(100% - 4px); border-width: 2px; border-color: #000;}

.yogoPricingChoice .ypcBlock .content .block button span {width: 100%;}
.yogoPricingChoice .ypcBlock .content .block button .tit {display: block; font-size: 14px; font-weight: bold; color: #5F5F5F; line-height: 1.2; letter-spacing: -0.5px;}
.yogoPricingChoice .ypcBlock .content .block button.on .tit {color: #000;}
.yogoPricingChoice .ypcBlock .content .block button .txt {display: block; font-size: 9px; color: #5F5F5F; line-height: normal; font-weight: 500;}
.yogoPricingChoice .ypcBlock .content .block button .txt strong {display: inline-block; margin-right: 1px; color: #5F5F5F;}

.yogoPricingChoice .addPChoiceButton {display: block; margin: 24px auto 0; padding: 8px 4px; width: 50%; height: 56px; background-color: #000; border-radius: 8px;}
.yogoPricingChoice .addPChoiceButton * {font-size: 18px; color: #fff; font-weight: bold;}
.yogoPricingChoice .addPChoiceButton:disabled {background-color: #EDEDED;}
.yogoPricingChoice .addPChoiceButton:disabled span {font-weight: normal; color: #A8A8A8;}

/* 추가 혜택 선택 */
[data-id="addPBenefit"] .content {display: flex; justify-content: space-between;}
[data-id="addPBenefit"] .content + .txt {margin-top: 24px; font-size: 12px; color: #5F5F5F;}
.yogoPricingChoice [data-id="addPBenefit"].ypcBlock {margin-top: 24px;}
.yogoPricingChoice [data-id="addPBenefit"].ypcBlock .content .block button {padding: 23px 7px; width: 100%; min-height: 98px; border-radius: 8px; background-color: #fff; text-align: center !important; -webkit-box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.12); box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.12);}

.yogoPricingChoice [data-id="addPBenefit"].ypcBlock .content .block .tit {position: relative; display: flex; align-items: center; justify-content: center; font-size: 18px; color: #000; padding: 3px 0; box-sizing: border-box;}
.yogoPricingChoice [data-id="addPBenefit"].ypcBlock .content .block .txt {display: block; margin-top: 2px; font-size: 14px; line-height: normal; color: #000;}

.yogoPricingChoice [data-id="addPBenefit"].ypcBlock .content .block.benefit button .tit::before {content: ''; display: inline-block; width: 24px; height: 24px; margin-right: 2px; background: #fff url(/unify/pc/images/yogo/yogo_icon_benefit.svg) no-repeat 0 50%; background-size: 24px auto;}
.yogoPricingChoice [data-id="addPBenefit"].ypcBlock .content .block.point button .tit::before {content: ''; display: inline-block; width: 24px; height: 24px; margin-right: 2px; background: #fff url(/unify/pc/images/yogo/yogo_icon_point.svg) no-repeat 0 50%; background-size: 24px auto;}

/* 월 납부 금액 */
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop {display: block;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop > span {display:block; font-size: 14px; font-weight: bold; color: #276DCC;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop .txt {font-size: 24px; font-weight: bold; color: #000; line-height: normal;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop .txt strong {display: inline-block;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop .txt br {display: block;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop .priceNotIncluded {font-size: 14px; font-weight: normal;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop.hide .txt {font-size: 20px;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titTop.hide .priceNotIncluded {font-size: 12px;}

.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titMonth {display: block; margin-top:8px; padding-top: 8px; border-top: 1px solid #D9D9D9; font-size: 14px;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titMonth li {position:relative; display: flex; justify-content: space-between; font-weight: 500; color: #000;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titMonth li + li {margin-top: 4px;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titMonth li strong {display: inline-block; font-weight: bold;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titMonth li.free {padding-left: 28px; color: #276DCC;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titMonth li.free * {color: #276DCC;}
.yogoPricingChoice .yTitle [data-id="addPPriceTit"] .titMonth li.free::before {content: ''; position: absolute; top: 5px; left: 12px; width: 8px; height: 8px; border-top: 1px solid #276DCC; border-right: 1px solid #276DCC; transform: rotate(180deg);}

.yogoPricingChoice [data-id="addPPrice"].ypcBlock {margin-top: 8px;}
.yogoPricingChoice [data-id="addPPrice"].ypcBlock .txtMonth {padding: 12px 12px 12px 28px; background-color: #F2F2F2; border-radius: 8px; font-size: 13px;}
.yogoPricingChoice [data-id="addPPrice"].ypcBlock .txtMonth li {display: flex; justify-content: space-between; font-weight: 500; color: #161616;}
.yogoPricingChoice [data-id="addPPrice"].ypcBlock .txtMonth li + li {margin-top: 4px;}
.yogoPricingChoice [data-id="addPPrice"].ypcBlock .txtMonth li strong {display: inline-block; font-weight: 500;}

/********** popup **********/
.alert.yogoPricingPopup .layerBox {width: 500px; border-radius: 24px;}
#yogoMorePoint.alert.yogoPricingPopup .layerBox {width: 720px;}

.layerWrap.yogoPricingPopup .layerBox .layerFoot {margin: 10px 0 0; padding: 0 40px 32px;}

/* yogoPricingPopup 하나 더 받을 포인트 혜택  */
.layerWrap.yogoPricingPopup .layerBox .layerHeader {position: relative; top: 0; right: 0; left: 0; padding: 40px; background-color: #fff; z-index: 10;}
.layerWrap.yogoPricingPopup .layerBox .layerHeader .layerTit {height: auto; line-height: 25px; font-size: 20px; font-weight: bold; padding: 0; display: inline-block !important;}
.layerWrap.yogoPricingPopup .layerBox .layerHeader .layerTit br {display: none;}
.layerWrap.yogoPricingPopup.alert .layerBox .layerBody {padding-top: 0;}
.layerWrap.yogoPricingPopup.alert .layerBox .btnLayerClose {top: 44px; right: 22px; height: 20px; background-size: 18px auto;}

.yogoPricingPopupList button {position: relative; display: flex; align-items: center; width: 100%; padding: 12px 32px; font-size: 16px;}
.yogoPricingPopupList button:after,
.yogoPricingPopupList button:focus {outline: rgba(0, 0, 0, 0.7) dashed 1px !important;}
.yogoPricingPopupList button::before {content: ''; position: absolute; top: 0; left: 0; width: calc(100% - 2px); height: 100%; border: 1px solid #D9D9D9; border-radius: 8px; z-index: -1;}
.yogoPricingPopupList button.on::before {border-width: 2px; border-color: #000;}
.yogoPricingPopupList button + button {margin-top: 12px;}
.yogoPricingPopupList button .img {max-width: 40px; margin-right: 14px;}
.yogoPricingPopupList button .img img {width: 40px; filter: drop-shadow(4px 1.5px 2.5px #00000040);}
.yogoPricingPopupList button .tit {width: calc(100% - 94px); text-align: left;}
.yogoPricingPopupList button .point {margin-left: 6px; min-width: 70px; text-align: right;}
.yogoPricingPopupList button.on .tit {font-weight: bold; color: #000;}
.yogoPricingPopupList button.on .point {font-weight: bold; letter-spacing: -0.2px; color: #000;}
.yogoPricingPopupList button.on .point span {color: #000;}
.yogoPricingPopupList button.yogoPPMore .tit {width: calc(100% - 24px);}

/* yogoPricingAgain 요금제 다시 선택  */
.layerWrap.yogoPricingPopup.alert .yogoPricingAgain {padding-top: 72px; font-size: 20px; font-weight: bold; text-align: center; color: #000;}
.layerWrap.yogoPricingPopup.alert .layerBtnBox {margin-bottom: 20px; display: flex; justify-content: space-between;}
.layerWrap.yogoPricingPopup.alert .btnLayerItem {display: inline-block; box-sizing: border-box; width: 100%; height: 56px; background-color: #000; color: #fff; border: none; text-align: center; border-radius: 6px;}
.layerWrap.yogoPricingPopup.alert .btnLayerItem + .btnLayerItem {margin-left: 8px;}
.layerWrap.yogoPricingPopup.alert .btnLayerItem span {display: inline-block; height: 40px; line-height: 38px; font-size: 18px; font-weight: 500; color: #fff;}
.layerWrap.yogoPricingPopup.alert .btnLayerItem.btnLayerCancleClose {background-color: #fff; border: 1px solid #000;}
.layerWrap.yogoPricingPopup.alert .btnLayerItem.btnLayerCancleClose span {color: #000 !important;}

/* yogoPricingAgain 포인트 혜택  */
.layerWrap.yogoPricingPopup.alert.yogoPricingGolfzonPopup .yogoPricingAgain {text-align:left}
.layerWrap.yogoPricingPopup.alert.yogoPricingGolfzonPopup .yogoPricingAgain .brM {display: none;}
.layerWrap.yogoPricingPopup.alert.yogoPricingGolfzonPopup .yogoPricingAgain .con {margin-top: 16px; font-size: 14px; font-weight: 400; color: #000}

/********** as-is reset **********/
/* alert */
.alert.directChoice .layerBox {padding: 24px 0;}
.alert.directChoice .layerBox .layerBody {padding: 20px 0 10px;}
.alert.directChoice .layerBox .btnLayerClose {position: absolute; top: 20px; right: 20px; width: 24px; height: 24px; background: #fff url(/unify/pc/images/yogo/yogo_btn_layer_close.png) 50% 50% / 20px auto no-repeat; z-index: 10; border: 0;}

/* popup-couponpack 쿠폰팩 유의사항  */
#popup-couponpack.layerWrap .layerBox .layerHeader {position: relative; top: 0; right: 0; left: 0; padding: 36px 40px; background-color: #fff; z-index: 10; border-bottom: 1px solid #D9D9D9;}
#popup-couponpack .layerBox .layerHeader .layerTit {height: auto; line-height: 25px; font-size: 24px; font-weight: bold; padding: 0; display: inline-block !important;}
#popup-couponpack.layerWrap .layerBox .layerBody {padding-top: 0; margin-top: 0;}
#popup-couponpack.layerWrap .layerWrap .layerBox .layerContent {padding: 24px 70px 24px 80px;}

#popup-couponpack.layerWrap .layerBox .btnLayerClose {top: 40px; right: 20px; height: 20px; background-size: 18px auto;}

#popup-couponpack .number-list {counter-reset:list-number; font-size: 14px; padding-top: 32px;}
#popup-couponpack .number-list > li {position: relative; padding-left: 20px; counter-increment: list-number; color: #000;}
#popup-couponpack .number-list > li + li {margin-top: 16px;}
#popup-couponpack .number-list > li:before {text-indent:-1px; content: counter(list-number) "."; position:absolute; top: 0px; left:0; width:16px; height:20px;line-height: 19px; background-color: transparent; color: inherit; text-align: right; border-radius: 0; font-weight: normal;}

#popup-couponpack.layerWrap .layerBox .layerFoot {padding: 24px 0; margin: 0; text-align: center; -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);}
#popup-couponpack.layerWrap .btnLayerItem {display: inline-block; box-sizing: border-box; width: 290px; height: 56px; text-align: center; border-radius: 8px; border: none; background-color: #000;}
#popup-couponpack.layerWrap .btnLayerItem span {display: inline-block; height: 32px; line-height: 30px; font-size: 18px; font-weight: bold; color: #fff;}
/********** //as-is reset **********/