.s-character-tabs{color:#fff}.s-character-tabs>.tab-content.is-active{margin-bottom:3rem}.s-character-tabs .tab-content{display:none;flex-direction:column}.s-character-tabs .tab-content.is-active{display:flex}.s-character-tabs ol,.s-character-tabs ul{list-style:none;padding:0;margin:0}.s-character-tabs ol button,.s-character-tabs ul button{text-decoration:none;color:inherit;background:transparent;border:0;-webkit-appearance:none;appearance:none}.s-character-tabs ol button:focus,.s-character-tabs ul button:focus{outline:none}.s-character-tabs ol button:hover,.s-character-tabs ul button:hover{text-decoration:none;outline:none}.s-character-tabs ol button:disabled,.s-character-tabs ul button:disabled{opacity:.5;pointer-events:none}.s-character-tabs .group-nav{display:inline-flex;align-items:center;width:100%}@media (max-width: 1023.98px){.s-character-tabs .group-nav{overflow-x:auto}.s-character-tabs .group-nav::-webkit-scrollbar{width:.5rem;height:.5rem}.s-character-tabs .group-nav::-webkit-scrollbar-thumb{background:var(--colour-takeover-secondary);border:3px solid #3b3b3b;border-radius:6px}.s-character-tabs .group-nav::-webkit-scrollbar-track{background:#3b3b3b}.s-character-tabs .group-nav{scrollbar-face-color:var(--colour-takeover-secondary);scrollbar-track-color:#3b3b3b}}@media (min-width: 1024px){.s-character-tabs .group-nav{justify-content:center;flex-wrap:wrap}}@supports (gap: 1rem){.s-character-tabs .group-nav{gap:1rem}}.s-character-tabs .group-nav li{flex-shrink:0}@media (min-width: 1024px){.s-character-tabs .group-nav li{width:20%}}.s-character-tabs .group-nav li button{height:3.5rem;display:flex;align-items:center;justify-content:center;padding:0 1rem;border:2px solid #FFFFFF;color:#fff;background-color:#171717;transition:border .3s ease-in-out;white-space:nowrap}@media (min-width: 1024px){.s-character-tabs .group-nav li button{padding:0 1.5rem;width:100%}}.s-character-tabs .group-nav li button img{height:2.5rem;width:2.5rem;object-fit:contain;margin-right:.5rem}.s-character-tabs .group-nav li button[aria-selected=true]{border-color:var(--colour-takeover-secondary)}.s-character-tabs .group-nav li:hover button,.s-character-tabs .group-nav li:focus button{border-color:var(--colour-takeover-secondary)}@media (min-width: 1280px){.s-character-tabs .character-nav{position:absolute;bottom:2rem;right:2rem;z-index:12;width:400px}}@media (min-width: 1280px){.s-character-tabs .character-nav>.container{position:relative}}.s-character-tabs .character-nav ul{display:flex;flex-wrap:wrap}@media (max-width: 1023.98px){.s-character-tabs .character-nav ul{padding:0 1rem}}@supports (display: grid){.s-character-tabs .character-nav ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:1rem}@media (min-width: 576px){.s-character-tabs .character-nav ul{grid-template-columns:-webkit-max-content;grid-template-columns:max-content;grid-auto-flow:column;justify-content:center}}@media (min-width: 768px){.s-character-tabs .character-nav ul{grid-gap:2rem}}@media (min-width: 1280px){.s-character-tabs .character-nav ul{grid-template-columns:repeat(4,minmax(0,4rem));grid-auto-flow:dense;justify-content:flex-start}}}.s-character-tabs .character-nav ul li{display:flex}@media (max-width: 767.98px){.s-character-tabs .character-nav ul li{justify-content:center}}.s-character-tabs .character-nav ul li button{height:4rem;width:4rem;border-radius:100%;border:2px solid #FFFFFF;opacity:.5;transition:opacity ease-in-out .3s;padding:0;margin:0;box-sizing:content-box;flex-shrink:0;overflow:hidden}@media (min-width: 768px){.s-character-tabs .character-nav ul li button{height:3.5rem;width:3.5rem}}.s-character-tabs .character-nav ul li button img{height:100%;width:100%;object-fit:contain}.s-character-tabs .character-nav ul li button[aria-selected=true]{opacity:1}.s-character-tabs .character-nav ul li:hover button,.s-character-tabs .character-nav ul li:focus button{opacity:1}.s-character-tabs .wrapper{margin:2rem 0 1rem;width:100%}@media (min-width: 768px){.s-character-tabs .wrapper{margin:2rem 0}}@media (min-width: 1280px){.s-character-tabs .wrapper{position:relative;min-height:600px;height:80vh;max-height:800px}.t-product-guild-ball .s-character-tabs .wrapper{min-height:800px;height:100vh;max-height:1000px}}@media (min-width: 1280px){.s-character-tabs .wrapper>.tab-content{position:absolute;top:0;left:0;height:100%;width:100%}}@media (min-width: 1280px){.s-character-tabs .wrapper>.tab-content>.container{position:relative}}.s-character-tabs .wrapper>.tab-content:after{content:"";position:absolute;top:0;right:0;height:100%;width:50%;z-index:10;background:linear-gradient(270deg,#171717,rgba(23,23,23,.9) 20%,transparent)}@media (max-width: 1279.98px){.s-character-tabs .wrapper>.tab-content:after{display:none}}.s-character-tabs .wrapper .images{position:relative;width:100%}@media (min-width: 1280px){.s-character-tabs .wrapper .images{position:absolute;top:0;left:0;height:100%}}.s-character-tabs .wrapper .images .background-image{height:280px;width:100%;position:relative;z-index:1;display:block}@media (min-width: 768px){.s-character-tabs .wrapper .images .background-image{height:360px}}@media (min-width: 1280px){.s-character-tabs .wrapper .images .background-image{height:100%}}.s-character-tabs .wrapper .images .background-image img{height:100%;width:100%;object-fit:cover}.s-character-tabs .wrapper .images .foreground-image{height:200px;width:auto;object-fit:contain;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:11}@media (min-width: 1280px){.s-character-tabs .wrapper .images .foreground-image{left:20%;transform:translate(-10%,-50%);height:90%}}.s-character-tabs .wrapper .content-wrapper{display:flex;flex-direction:column}@media (max-width: 1279.98px){.s-character-tabs .wrapper .content-wrapper{align-items:center}}@media (min-width: 1280px){.s-character-tabs .wrapper .content-wrapper{width:100%;max-width:400px;position:absolute;right:2rem;top:4rem;z-index:11;height:calc(100% - 6rem);display:flex;flex-direction:column}}.s-character-tabs .wrapper .content-wrapper .c-btn-primary{align-self:center}@media (min-width: 1280px){.s-character-tabs .wrapper .content-wrapper .c-btn-primary{align-self:flex-start}}@media (max-width: 1279.98px){.s-character-tabs .wrapper .content{text-align:center;max-width:600px}}.s-character-tabs .wrapper .content .tagline{color:var(--colour-takeover-secondary)}.s-character-tabs .wrapper .content .title{font-size:1.5rem;font-weight:700}@media (min-width: 768px){.s-character-tabs .wrapper .content .title{margin-bottom:1.5rem}}
/*# sourceMappingURL=/cdn/shop/t/80/assets/character-tabs.css.map */