@charset "utf-8";

.swiper-container {overflow: hidden;}
.modal__content {max-width: 400px;}
/* ----------------------------------------------------------------
					visual
-----------------------------------------------------------------*/ 
.visual {background: #DFEDFF; box-sizing: border-box; position: relative; padding: 35px 0 15px;}
.visual .container {width: 80%; max-width: 500px;}
.visual__text--main {width: 208px; height: 120px; font-size: 0; text-indent: -999em; background: url(//img.enuri.info/images/event/2025/shopping-guide/visual-text1.png) 0 0 / 100%;}
.visual__text--sub { height: 41px; font-size: 0; text-indent: -999em; background: url(//img.enuri.info/images/event/2025/shopping-guide/visua-text2.png) 0 0 / 119px no-repeat; margin-top: 6px;}
.visual-img {width: 239px; height: 172px; background: url(//img.enuri.info/images/event/2025/shopping-guide/visual-img.png) 0 0 / 100%; margin-top: 8px; position: relative; margin-left: auto;}
.visual-img::before {content: ""; width: 29px; height: 34px; background: url(//img.enuri.info/images/event/2025/shopping-guide/coin1.png) 0 0 / 100%; position: absolute; right: 50px; bottom: 75px; animation: coin1 1s infinite; animation-direction: alternate;}
.visual-img::after {content: ""; width: 41px; height: 47px; background: url(//img.enuri.info/images/event/2025/shopping-guide/coin2.png) 0 0 / 100%; position: absolute; right: 22px; top: 20px; animation: coin2 1s infinite; animation-delay: 0.5s; animation-direction: alternate;  opacity: 0;}

@keyframes coin1 {
	0% {transform: translate(10px, 10px); opacity: 0;}
	100% {transform: translate(0,0); opacity: 1;}
}
@keyframes coin2 {
	0% {transform: translate(-10px, 50px); opacity: 0;}
	100% {transform: translate(0,0); opacity: 1;}
}

@media (min-width:768px) {
	.visual {padding: 66px 0 42px;}
	.visual .container {max-width: none; width: 760px;}
	.visual-content {display: flex; flex-wrap: wrap; justify-content: space-between;}
	.visual__text--main {width: 299px; height: 166px; background: url(//img.enuri.info/images/event/2025/shopping-guide/visual-text1_pc.png) 0 0 / 100%;}
	.visual__text--sub {width: 100%; order: 3; background: url(//img.enuri.info/images/event/2025/shopping-guide/visua-text2_pc.png) 0 0 / 372px no-repeat; margin-top: -45px; height: 28px;}
	.visual-img {margin:0; background: url(//img.enuri.info/images/event/2025/shopping-guide/visual-img_pc.png) 0 0 / 100%; width: 360px; height: 260px;}
	.visual-img::before {width: 57px; height: 64px; background: url(//img.enuri.info/images/event/2025/shopping-guide/coin1_pc.png) 0 0 / 100%; right: 70px; bottom: 108px;}
	.visual-img::after {width: 76px; height: 86px; background: url(//img.enuri.info/images/event/2025/shopping-guide/coin2_pc.png) 0 0 / 100%; }
}

/* ----------------------------------------------------------------
					tab
-----------------------------------------------------------------*/
.tab {background: #DFEDFF; width: 100%;}
.tab.is_fixed {position: fixed;width: 100%; z-index: 10;}
.tab .container {display: flex; padding: 0; height: auto;}
.tab-button {width: 25%; padding: 17px 0; font-size: 15px; color: #fff; line-height: 18px; background: #88BDFF; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 16px 16px 0 0; font-weight: 700;}
.tab-button.on {background: #1A70DD;}

@media (min-width:768px){
	.tab-button {font-size: 26px; line-height: 31px; padding: 18px 0;}
}

@media (min-width:768px) and (max-width:1024px) {
	.tab .container {width: 100%;}
}

/* ----------------------------------------------------------------
					section
-----------------------------------------------------------------*/
.title {font-size: 14px; font-weight: 700; color: #1A70DD; line-height: 17px;}
.sub-title {font-size: 20px; font-weight: 700; color: #000; line-height: 26px; margin-top: 10px;}
.sub-title em {color: #1A70DD;}
.i-emoney {font-size: 0; text-indent: -999em; width: 89px; height: 21px; background: url(//img.enuri.info/images/event/2025/shopping-guide/emoney.png) 0 0 / 100%; display: inline-block; vertical-align: middle;}
.section { padding: 36px 0; text-align: center; }
.section .container {width: 100%; max-width: 1200px;}

@media (min-width:768px){
	.title {font-size: 24px; line-height: 29px;}
	.sub-title {font-size: 32px; line-height: 43px; margin-top: 16px;}
	.section {padding: 62px 0 72px;}
	.i-emoney {width: 142px; height: 33px; background: url(//img.enuri.info/images/event/2025/shopping-guide/emoney_pc.png) 0 0 / 100%; vertical-align: 8px;}
}


/* ----------------------------------------------------------------
					shopping
-----------------------------------------------------------------*/
.shopping-method {margin-top: 28px;}
.shopping-method__tab {background: #EEEEEE; width: 180px; margin: 0 auto; border-radius: 50px; padding: 4px; display: flex; gap: 0 12px; box-sizing: border-box;}
.method__tab--button {font-size: 14px; line-height: 18px;  padding: 7px 24px;}
.method__tab--button.on {color:#222; font-weight: 700; background: #fff;border-radius: 18px; box-shadow: 0px 2px 4px 0px #0000000F;}
.shopping-method__content {margin: 24px 0;}
.method-tab__panel {display: none; background: #F8F8F8; border-radius: 12px; padding: 22px 16px 24px; width: 300px; margin: 0 auto; box-sizing: border-box;}
.method-tab__panel.active {display: block;}
.method:not(:first-child) {margin-top: 16px;}
.method-title {display: flex; gap: 0 12px; font-size: 15px; line-height: 21px; color: #3A3E41; align-items: center;}
.method-title h4 {font-weight: 600;}
.title-number {font-size: 13px; font-weight: 700; background: #ddd; width: 24px; height: 24px; border-radius: 50%; line-height: 24px;}
.shop-number {background: #3A3E41;}
.method-content {margin-top: 15px; margin-left: 36px; position: relative; width: 220px; height: 184px;}
#method1 .method-content1 {background: url(//img.enuri.info/images/event/2025/shopping-guide/method-content1.png) 0 0 / 100%;}
#method1 .method-content2 {background: url(//img.enuri.info/images/event/2025/shopping-guide/method-content2.png) 0 0 / 100%;}
.method-content1:before,
.method-content2:before {content: ""; width: 2px; height: 100%; background: #ddd; position: absolute; left: -24px; top: 0;}
.shopping-method .swiper-container {margin: 20px -20px 28px;}
.shopping-method .swiper-container::before {content: ""; background: #FFFFFF; border-radius: 20px; border: 2px solid #eee ; box-shadow: 0px 2px 6px 0px #0000001A; width: 120px; height: 120px; position: absolute; left: 50%; transform: translateX(-50%);}
.shopping-method .swiper-slide {width: calc(100% / 3) !important;transform: scale(0.8); height: 120px; display: flex; align-items: center; justify-content: center; transition: 0.3s all;}
.shopping-method .swiper-slide img {max-width: 60px; width: 100%;}
.shopping-method .swiper-slide-active {transform: scale(1);}
.all-shop__button {background: #3A3E41; color: #fff; font-size: 13px; line-height: 16px; padding: 12px 0; width: 100%; border-radius: 8px;}
.noti__button {font-size: 12px; line-height: 16px; color: #888888; text-decoration: underline; text-underline-offset: 3px; letter-spacing: -0.6px;}

@media (min-width:768px){
	.shopping-method {margin-top: 36px;}
	.shopping-method__tab {width: 236px; padding: 7px 8px;}
	.method__tab--button {font-size: 22px; line-height: 18px; padding: 17px 28px; letter-spacing: -0.8px;}
	.method__tab--button.on {border-radius: 50px;}
	.shopping-method__content {margin: 32px 0;} 
	.method-tab__panel {width: 100%; max-width: 800px; padding: 40px 180px 80px 113px; border-radius: 20px;}
	.method-content {width: 440px; height: 368px; margin-left: 67px;}
	.method:not(:first-child) {margin-top: 66px}
	.title-number {width: 50px; height: 50px; line-height: 50px; font-size: 22px;}
	.method-title {font-size: 24px; line-height: 34px;}
	.method-content1:before, .method-content2:before {left: -44px; width: 4px; height: 404px;}
	.shopping-method .swiper-container {margin: 12px -20px 60px 20px}
	.shopping-method .swiper-container::before {width: 212px; height: 212px; transform: translateX(0); margin-left: -122px; border-radius: 32px;}
	.shopping-method .swiper-slide {height: 212px;}
	.shopping-method .swiper-slide img {max-width: 120px; }
	.all-shop__button {font-size: 26px; line-height: 34px; padding: 23px 0; width: 400px; margin-left: 40px;}
	.noti__button {font-size: 18px; text-underline-offset: 5px;}
}
/* ----------------------------------------------------------------
					confirm-purchase
-----------------------------------------------------------------*/
#confirm-purchase {background: #F4F9FF;}
.confirm-purchase__content {width: 252px; height: 543px; background: url(//img.enuri.info/images/event/2025/shopping-guide/confirm-purchase__content.png) 0 0 / 100%; margin: 32px auto 0; position: relative;}
.confirm-purchase__content::before {content: ""; width: 226px; height: 47px; position: absolute; left: 10px; bottom: 68px;}
.confirm-purchase__content.active::before {animation: stress 0.9s infinite alternate ease-in; animation-delay: 0.7s; z-index: 2;}
.confirm-purchase__content.active::after {content:"";width: 228px; height: 49px; background: url(//img.enuri.info/images/event/2025/shopping-guide/confirm-purchase__content2.png) 0 0 / 100%; position: absolute; bottom: 67px; left: 10px; opacity: 0; animation: up 0.7s forwards;}

@keyframes up {
	0% {transform: translateY(50px); opacity: 0;}
	100% {transform: translateY(0); opacity: 1;}
}

@keyframes stress {
	0%{background: url(//img.enuri.info/images/event/2025/shopping-guide/highlight1.png) 0 0 / 100%;}
	25%{background: url(//img.enuri.info/images/event/2025/shopping-guide/highlight2.png) 0 0 / 100%;}
	50%{background: url(//img.enuri.info/images/event/2025/shopping-guide/highlight3.png) 0 0 / 100%;}
	100%{background: url(//img.enuri.info/images/event/2025/shopping-guide/highlight4.png) 0 0 / 100%;}
}
@media (min-width:768px){
	.confirm-purchase__content {width: 440px; background: url(//img.enuri.info/images/event/2025/shopping-guide/confirm-purchase__content_pc.png) 0 0 / 100%; margin-top: 54px; height: 948px;}
	.confirm-purchase__content::before {width: 392px; height: 82px;  bottom: 120px; left: 20px;}
	.confirm-purchase__content.active::after {width: 399px; height: 87px; background: url(//img.enuri.info/images/event/2025/shopping-guide/confirm-purchase__content2_pc.png) 0 0 / 100%; bottom: 114px; left: 18px;}
}

/* ----------------------------------------------------------------
					saving-complete
-----------------------------------------------------------------*/
.saving-complete__content {width: 252px; height: 325px; background: url(//img.enuri.info/images/event/2025/shopping-guide/saving-complete__content.png) 0 0 / 100%; margin: 32px auto 0; font-size: 0; text-indent: -999em; position: relative;}
.saving-complete__content.active::before {content: ""; width: 37px; height: 18px;  background: #fff; position: absolute; top: 94px; right: 35px; }
.saving-money {font-size: 13px; color: #000; font-weight: 700; position: absolute; width: 100%; text-align: right;padding-right: 36px;box-sizing: border-box; left: 0; top: 92px; font-family: 'roboto'; z-index: 2;  line-height: 26px;}

@media (min-width:768px){
	.saving-complete__content {width: 440px; height: 554px;background: url(//img.enuri.info/images/event/2025/shopping-guide/saving-complete__content_pc.png) 0 0 / 100%;}
	.saving-complete__content.active::before {width: 58px; height: 24px; top: 167px; right: 64px;}
	.saving-money {top: 163px; font-size: 23px; padding-right: 63px; line-height: 28px;}
}

/* ----------------------------------------------------------------
					using
-----------------------------------------------------------------*/
#using {background: #F4F9FF;}
.using__content {width: 252px; height: 214px; background: url(//img.enuri.info/images/event/2025/shopping-guide/using__content.png) 0 0 / 100%; margin: 32px auto 0; }

@media (min-width:768px){
	.using__content {background: url(//img.enuri.info/images/event/2025/shopping-guide/using__content_pc.png) 0 0 / 100%; width: 440px; height: 372px; margin-top: 48px;}
}

/* ----------------------------------------------------------------
					shoppingmall
-----------------------------------------------------------------*/
#shoppingmall .swiper-wrapper {transition-timing-function: linear}
#shoppingmall .swiper-slide {width: 120px !important;}
.shoppingmall__content {margin-top: 24px;}
.move-shopping {background: #1A70DD; color: #fff; font-size: 13px; line-height: 17px; padding: 12px 0; width: 248px; margin: 24px auto 0; border-radius: 8px; letter-spacing: -0.5px; display: flex; gap: 0 5px; align-items: center; justify-content: center; font-weight: 600;}
.move-shopping i {background: url(https://img.enuri.info/images/event/2025/saving-manual/feb/move-link.png) 0 50% / 100% no-repeat; width: 7px; height: 16px;}

@media (min-width:768px){
	.shoppingmall__content {max-width: 800px; margin: 48px auto 0;}
	#shoppingmall .swiper-slide {width: 240px !important;}
	.move-shopping {font-size: 26px; line-height: 34px; width: 400px; padding: 23px 0; margin-top: 48px; gap: 0 12px;}
	.move-shopping i {background: url(//img.enuri.info/images/event/2025/shopping-guide/move-shopping.png) 0 0 / 100%; width: 12px; height: 20px;}
}

/* ----------------------------------------------------------------
					modal
-----------------------------------------------------------------*/
.modal__content {border-radius: 20px; padding: 16px;}
.modal__title {font-size: 18px; line-height: 25px; color: #333; font-weight: 600;}
.modal__close {top: 16px; right: 16px;}
.modal__actions button {width: 100%; border-radius: 8px; font-size: 16px; font-weight: 700; line-height: 22px;}
.shop-list {display: flex; flex-wrap: wrap; gap: 12px 0; max-height: 208px; overflow-y: auto; padding-bottom: 28px;}
.shop-list li {width: 50%; font-size: 14px; line-height: 28px; color: #333; padding-left: 32px; box-sizing: border-box; text-align: left; background-size: 28px; background-repeat: no-repeat; background-position: 0 50%; letter-spacing: -1px;}
.shop-gmarket {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-gmarket.png);}
.shop-auction {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-auction.png);}
.shop-11st {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-11st.png);}
.shop-gs {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-gs.png);}
.shop-cj {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-cj.png);}
.shop-ssg {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-ssg.png);}
.shop-sk {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-sk.png);}
.shop-homeplus {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-homeplus.png);}
.shop-naver {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-naver.png);}
.shop-nol {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-nol.png);}
.shop-noltour {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-noltour.png);}
.shop-hotels {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-hotels.png);}
.shop-agoda {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-agoda.png);}
.shop-expedia {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-expedia.png);}
.shop-trip {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-trip.png);}
.shop-rakuten {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-rakuten.png);}
.shop-triple {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-triple.png);}
.shop-airalo {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-airalo.png);}
.shop-triple {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-triple.png);}
.shop-klook {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-klook.png);}
.shop-booking {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-booking.png);}
.shop-aliexpress {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-aliexpress.png);}
.shop-iherb {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-iherb.png);}
.shop-shein{background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-shein.png);}
.shop-yoox{background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-yoox.png);}
.shop-zigzag {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-zigzag.png);}
.shop-posty {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-posty.png);}
.shop-w {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-w.png);}
.shop-pulmuone {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-pulmuone.png);}
.shop-cjmarket {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-cjmarket.png);}
.shop-hfashion {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-hfashion.png);}
.shop-adidas {background: url(//img.enuri.info/images/event/2025/shopping-guide/shop-adidas.png);}
.noti-img {width: 249px;}
#mddalNoti .modal__body{margin-bottom: 28px; text-align: center;}

@media (min-width:768px){
	.shop-list {gap: 14px 0;}
	.shop-list li { font-size: 16px; line-height: 30px; padding-left: 34px; letter-spacing: 0;}
}