@import"https://spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css";.ople-pdp-banners{position:relative;width:100%;max-width:100%;margin:0 auto 32px;overflow:hidden;border-radius:12px;font-family:Spoqa Han Sans Neo,-apple-system,BlinkMacSystemFont,sans-serif}.ople-banner-track{position:relative;width:100%;aspect-ratio:1 / 1;max-height:560px}@media(min-width:750px){.ople-banner-track{aspect-ratio:16 / 9;max-height:480px}}.ople-banner-slide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;visibility:hidden;transition:opacity .7s cubic-bezier(.4,0,.2,1),visibility .7s;z-index:1}.ople-banner-slide.is-active{opacity:1;visibility:visible;z-index:2}.ople-banner-bg{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.ople-banner-img{width:100%;height:100%;object-fit:cover;object-position:center}.ople-banner-gradient{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;pointer-events:none}.ople-banner-gradient--left{background:linear-gradient(to right,rgba(0,0,0,.72) 0%,rgba(0,0,0,.45) 35%,rgba(0,0,0,.08) 70%,transparent 100%)}.ople-banner-gradient--right{background:linear-gradient(to left,rgba(0,0,0,.72) 0%,rgba(0,0,0,.45) 35%,rgba(0,0,0,.08) 70%,transparent 100%)}.ople-banner-gradient--bottom{background:linear-gradient(to top,rgba(0,0,0,.75) 0%,rgba(0,0,0,.35) 45%,transparent 100%)}.ople-banner-gradient--center{background:#0000006b}.ople-banner-content{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:flex;align-items:center;padding:28px 24px;color:#fff}.ople-banner-content--left{justify-content:flex-start}.ople-banner-content--left .ople-banner-content-inner{text-align:left;max-width:52%}.ople-banner-content--right{justify-content:flex-end}.ople-banner-content--right .ople-banner-content-inner{text-align:right;max-width:52%}.ople-banner-content--center{justify-content:center}.ople-banner-content--center .ople-banner-content-inner{text-align:center;max-width:65%}.ople-banner-content-inner{transform:translateY(12px);opacity:0;animation:none}.ople-banner-slide.is-active .ople-banner-content-inner{animation:opleBannerFadeUp .6s .25s cubic-bezier(.22,1,.36,1) forwards}@keyframes opleBannerFadeUp{to{opacity:1;transform:translateY(0)}}.ople-banner-tag{display:inline-block;padding:4px 14px;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;background:#ffffff26;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);border-radius:100px;margin-bottom:14px;color:#fff}.ople-banner-headline{font-size:14px;font-weight:300;letter-spacing:.4px;margin:0 0 8px;opacity:.85;line-height:1.5;color:#ffffffe6}.ople-banner-title{font-size:22px;font-weight:700;line-height:1.35;margin:0 0 6px;letter-spacing:-.3px;word-break:keep-all;color:#fff}.ople-banner-brand{font-size:12px;font-weight:500;letter-spacing:1px;text-transform:uppercase;margin:0 0 12px;opacity:.6;color:#ffffffb3}.ople-banner-body{font-size:13px;font-weight:400;line-height:1.65;margin:0 0 18px;opacity:.85;color:#ffffffe0;word-break:keep-all}.ople-banner-price-row{display:flex;align-items:center;gap:10px;margin-bottom:18px;flex-wrap:wrap}.ople-banner-content--center .ople-banner-price-row{justify-content:center}.ople-banner-content--right .ople-banner-price-row{justify-content:flex-end}.ople-banner-badge{display:inline-flex;align-items:center;padding:3px 10px;font-size:11px;font-weight:700;background:#e74c3c;color:#fff;border-radius:4px;letter-spacing:.5px}.ople-banner-price{font-size:20px;font-weight:700;color:#fff}.ople-banner-compare{font-size:14px;font-weight:400;color:#ffffff80;text-decoration:line-through}.ople-banner-cta{display:inline-flex;align-items:center;justify-content:center;padding:11px 28px;font-size:13px;font-weight:700;font-family:Spoqa Han Sans Neo,sans-serif;color:#111;background:#fff;border:none;border-radius:8px;text-decoration:none;cursor:pointer;transition:background .25s,transform .2s,box-shadow .25s;letter-spacing:.2px}.ople-banner-cta:hover{background:#f0f0f0;transform:translateY(-1px);box-shadow:0 4px 16px #0003}.ople-banner-cta:active{transform:translateY(0)}.ople-banner-nav{position:absolute;bottom:16px;left:50%;transform:translate(-50%);z-index:10;display:flex;align-items:center;gap:12px;padding:6px 14px;background:#0000004d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:100px;border:1px solid rgba(255,255,255,.1)}.ople-banner-arrow{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:none;border:none;color:#ffffffb3;cursor:pointer;padding:0;transition:color .2s;border-radius:50%}.ople-banner-arrow:hover{color:#fff;background:#ffffff1a}.ople-banner-dots{display:flex;align-items:center;gap:6px}.ople-banner-dot{width:7px;height:7px;border-radius:50%;border:none;background:#ffffff59;cursor:pointer;padding:0;transition:background .3s,transform .3s}.ople-banner-dot.is-active{background:#fff;transform:scale(1.3)}.ople-banner-dot:hover:not(.is-active){background:#fff9}@media(min-width:750px){.ople-pdp-banners{border-radius:16px;margin-bottom:40px;max-width:960px;margin-left:auto;margin-right:auto;padding:0 20px}.ople-banner-track{display:grid;grid-template-columns:62% 38%;grid-template-rows:1fr 1fr;gap:6px;aspect-ratio:unset;max-height:none;height:420px}.ople-banner-slide{position:relative!important;inset:unset!important;opacity:1!important;visibility:visible!important;z-index:1!important;transition:none!important;overflow:hidden;border-radius:12px;cursor:pointer}.ople-banner-slide:first-child{grid-column:1;grid-row:1 / 3;border-radius:16px 0 0 16px}.ople-banner-slide:nth-child(2){grid-column:2;grid-row:1;border-radius:0 16px 0 0}.ople-banner-slide:nth-child(3){grid-column:2;grid-row:2;border-radius:0 0 16px}.ople-banner-bg{position:absolute;top:0;right:0;bottom:0;left:0}.ople-banner-img{border-radius:0}.ople-banner-gradient{display:block!important}.ople-banner-slide:first-child .ople-banner-gradient{background:linear-gradient(to right,rgba(0,0,0,.75) 0%,rgba(0,0,0,.5) 35%,rgba(0,0,0,.1) 65%,transparent 100%)!important}.ople-banner-slide:nth-child(2) .ople-banner-gradient,.ople-banner-slide:nth-child(3) .ople-banner-gradient{background:linear-gradient(to top,#000000d1,#0006,#0000000d)!important}.ople-banner-content{position:absolute;top:0;right:0;bottom:0;left:0;background:none;border-radius:0;width:auto;order:unset}.ople-banner-slide:first-child .ople-banner-content{padding:40px 44px;align-items:center;justify-content:flex-start!important}.ople-banner-slide:first-child .ople-banner-content-inner{text-align:left!important;max-width:55%!important;opacity:1;transform:none;animation:none!important}.ople-banner-slide:first-child .ople-banner-tag{font-size:11px;padding:5px 16px;margin-bottom:18px}.ople-banner-slide:first-child .ople-banner-headline{font-size:15px;margin-bottom:10px}.ople-banner-slide:first-child .ople-banner-title{font-size:26px;letter-spacing:-.4px;line-height:1.3;margin-bottom:8px}.ople-banner-slide:first-child .ople-banner-brand{font-size:11px;margin-bottom:14px}.ople-banner-slide:first-child .ople-banner-body{font-size:13px;line-height:1.7;margin-bottom:20px;color:#fffc}.ople-banner-slide:first-child .ople-banner-price{font-size:24px}.ople-banner-slide:first-child .ople-banner-price-row{margin-bottom:22px}.ople-banner-slide:first-child .ople-banner-cta{padding:12px 32px;font-size:13px;border-radius:8px}.ople-banner-slide:nth-child(2) .ople-banner-content,.ople-banner-slide:nth-child(3) .ople-banner-content{padding:16px 20px;align-items:flex-end!important;justify-content:flex-start!important}.ople-banner-slide:nth-child(2) .ople-banner-content-inner,.ople-banner-slide:nth-child(3) .ople-banner-content-inner{text-align:left!important;max-width:100%!important;opacity:1;transform:none;animation:none!important}.ople-banner-slide:nth-child(2) .ople-banner-tag,.ople-banner-slide:nth-child(3) .ople-banner-tag{font-size:9px;padding:3px 10px;margin-bottom:8px}.ople-banner-slide:nth-child(2) .ople-banner-headline,.ople-banner-slide:nth-child(3) .ople-banner-headline{font-size:11px;margin-bottom:4px}.ople-banner-slide:nth-child(2) .ople-banner-title,.ople-banner-slide:nth-child(3) .ople-banner-title{font-size:16px;margin-bottom:4px;line-height:1.3;letter-spacing:-.3px}.ople-banner-slide:nth-child(2) .ople-banner-brand,.ople-banner-slide:nth-child(3) .ople-banner-brand{display:none}.ople-banner-slide:nth-child(2) .ople-banner-body,.ople-banner-slide:nth-child(3) .ople-banner-body{display:none}.ople-banner-slide:nth-child(2) .ople-banner-price,.ople-banner-slide:nth-child(3) .ople-banner-price{font-size:16px}.ople-banner-slide:nth-child(2) .ople-banner-compare,.ople-banner-slide:nth-child(3) .ople-banner-compare{font-size:12px}.ople-banner-slide:nth-child(2) .ople-banner-price-row,.ople-banner-slide:nth-child(3) .ople-banner-price-row{margin-bottom:10px}.ople-banner-slide:nth-child(2) .ople-banner-cta,.ople-banner-slide:nth-child(3) .ople-banner-cta{padding:8px 20px;font-size:11px;border-radius:6px}.ople-banner-slide:nth-child(2):hover .ople-banner-img,.ople-banner-slide:nth-child(3):hover .ople-banner-img{transform:scale(1.04);transition:transform .5s cubic-bezier(.22,1,.36,1)}.ople-banner-slide:nth-child(2) .ople-banner-img,.ople-banner-slide:nth-child(3) .ople-banner-img{transition:transform .5s cubic-bezier(.22,1,.36,1)}.ople-banner-slide:first-child:hover .ople-banner-img{transform:scale(1.02);transition:transform .6s cubic-bezier(.22,1,.36,1)}.ople-banner-slide:first-child .ople-banner-img{transition:transform .6s cubic-bezier(.22,1,.36,1)}.ople-banner-nav{display:none!important}}@media(min-width:1200px){.ople-pdp-banners{max-width:1000px;padding:0 24px}.ople-banner-track{height:440px;gap:8px}.ople-banner-slide:first-child .ople-banner-content{padding:44px 48px}.ople-banner-slide:first-child .ople-banner-title{font-size:28px}.ople-banner-slide:first-child .ople-banner-body{font-size:13px}.ople-banner-slide:nth-child(2) .ople-banner-content,.ople-banner-slide:nth-child(3) .ople-banner-content{padding:18px 22px}.ople-banner-slide:nth-child(2) .ople-banner-title,.ople-banner-slide:nth-child(3) .ople-banner-title{font-size:17px}}@media(max-width:480px){.ople-pdp-banners{border-radius:8px;margin-bottom:20px}.ople-banner-content{padding:20px 18px;align-items:flex-end}.ople-banner-content--left .ople-banner-content-inner,.ople-banner-content--right .ople-banner-content-inner,.ople-banner-content--center .ople-banner-content-inner{max-width:85%;text-align:left}.ople-banner-gradient--left,.ople-banner-gradient--right{background:linear-gradient(to top,rgba(0,0,0,.78) 0%,rgba(0,0,0,.4) 50%,transparent 100%)}.ople-banner-tag{font-size:10px;padding:3px 10px;margin-bottom:10px}.ople-banner-headline{font-size:12px;margin-bottom:6px}.ople-banner-title{font-size:18px;margin-bottom:4px}.ople-banner-brand{font-size:10px;margin-bottom:8px}.ople-banner-body{font-size:12px;line-height:1.55;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.ople-banner-price{font-size:17px}.ople-banner-price-row{margin-bottom:14px}.ople-banner-cta{padding:10px 22px;font-size:12px}.ople-banner-nav{bottom:10px;padding:4px 10px;gap:8px}.ople-banner-arrow{width:24px;height:24px}.ople-banner-dot{width:6px;height:6px}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/ople-pdp-banners.css.map */