/* ========== 组件样式 Components ========== */

.top-header {
  display:block;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  background:#0000001a;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:0px 6.2rem;
  z-index:9;
  border-bottom:solid 1px rgba(255,255,255,.1);
}

.top-header > .headercover {
  display:block;
  position:relative;
  width:100%;
  height:4.4rem;
}

.top-header > .headercover > a.logo {
  display:flex;
  align-items:center;
  position:relative;
  height:100%;
  line-height:0px;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  float:left;
}

.top-header > .headercover > a.logo > img {
  display:block;
  position:relative;
  height:2rem;
}

.top-header > .headercover > .action {
  display:flex;
  position:relative;
  height:100%;
  align-items:center;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  float:right;
}

.top-header > .headercover > .action > .wptbutton {
  display:block;
  position:relative;
  float:left;
}

.top-header > .headercover > .action > .wptbutton > a {
  height:2.6rem;
  line-height:2.6rem;
  padding:0px 1.6rem;
}

.top-header > .headercover > .action > .wptbutton > a > div {
  font-size:.8rem;
}

@media only screen and (max-width: 860px) {
  .top-header {
    padding:0px 2.8rem;
  }
  .top-header > .headercover {
    max-width:100%;
    height:11.4rem;
  }
  .top-header > .headercover > a.logo > img {
    height:5.2rem;
  }
  .top-header > .headercover > .action > .wptbutton > a {
    height:6.2rem;
    line-height:6.2rem;
    padding:0px 3.2rem;
  }
  .top-header > .headercover > .action > .wptbutton > a > div {
    font-size:1.75rem;
  }
}

@media only screen and (max-width: 520px) {
  .top-header {
    padding:0px 6rem;
  }
  .top-header > .headercover {
    height:15rem;
  }
  .top-header > .headercover > a.logo > img {
    height:7rem;
  }
  .top-header > .headercover > .action > .wptbutton > a {
    height:9rem;
    line-height:9rem;
    padding:0px 6rem;
  }
  .top-header > .headercover > .action > .wptbutton > a > div {
    font-size:3rem;
  }
}

.bottom-footer {
  display:flex;
  align-items:center;
  position:relative;
  width:100%;
  background:#180d0d;
  height:6.5rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:0px 1.5rem;
  line-height:0px;
  text-align:center;
  justify-content:center;
}

.bottom-footer > a {
  display:inline-block;
  position:relative;
  line-height:0px;
}

.bottom-footer > a > img {
  display:block;
  position:relative;
  height:2.5rem;
}

@media only screen and (max-width: 860px) {
  .bottom-footer {
    height:12.5rem;
    padding:0px 3rem;
  }
  .bottom-footer > a > img {
    height:4.5rem;
  }
}

@media only screen and (max-width: 520px) {
  .bottom-footer {
    height:18rem;
    padding:0px 4rem;
  }
  .bottom-footer > a > img {
    height:6.8rem;
  }
}

.component-banner {
  display:block;
  position:relative;
  width:100%;
}

.component-banner > .swiper   .box {
  display:block;
  position:relative;
  width:100%;
  overflow:hidden;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

.component-banner > .swiper   .box > .content {
  display:flex;
  align-items:center;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:0px 6.2rem;
}

.component-banner > .swiper   .box > .content > .contentcover {
  display:block;
  position:relative;
  width:100%;
}

.component-banner > .swiper   .box > .content > .contentcover > .cover {
  display:block;
  position:relative;
  width:100%;
  z-index:2;
}

.component-banner > .swiper   .box > .content > .contentcover > .cover > h1 {
  font-size:3.5rem;
  width:41rem;
}

.component-banner > .swiper   .box > .content > .contentcover > .cover > h2 {
  font-size:3.5rem;
  width:41rem;
}

.component-banner > .swiper   .box > .content > .contentcover > .cover > p {
  width:35rem;
  font-size:1.2rem;
  margin:1rem 0px 0px;
}

.component-banner > .swiper   .box > .content > .contentcover > .cover > .wptbutton {
  margin:2.5rem 0px 0px;
}

.component-banner > .swiper   .box > .image {
  display:block;
  position:relative;
  float:right;
  line-height:0px;
}

.component-banner > .swiper   .box > .image > img {
  display:block;
  position:relative;
}

.component-banner > .swiper   .box > .image > img.desktop {
  display:block;
  height:40rem;
}

.component-banner > .swiper   .box > .image > img.mobile {
  display:none;
  width:100%;
}

.component-banner > .banner-pagi {
  display:block;
  position:absolute;
  width:100%;
  height:2.4rem;
  bottom:4rem;
  left:0;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:0px 6.2rem;
}

.component-banner > .banner-pagi > .pagicover {
  display:block;
  position:relative;
  width:100%;
  height:2.4rem;
  line-height:0px;
}

.component-banner > .banner-pagi > .pagicover > .cover {
  display:block;
  position:relative;
  float:right;
  z-index:9;
}

.component-banner > .banner-pagi > .pagicover > .cover > .dots {
  display:block;
  position:relative;
  float:left;
  margin:0px 1.2rem 0px 0px;
  height:2.4rem;
  text-align:right;
}

.component-banner > .banner-pagi > .pagicover > .cover > .dots   div {
  display:flex;
  align-items:center;
  position:relative;
  height:2.4rem;
  margin:0px 1rem 0px 0px;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  float:left;
}

.component-banner > .banner-pagi > .pagicover > .cover > .dots   div.active {
  width:2.3rem;
}

.component-banner > .banner-pagi > .pagicover > .cover > .dots   div.active > span {
  width:2.3rem;
  background:#fff9;
}

.component-banner > .banner-pagi > .pagicover > .cover > .dots   div:last-child {
  margin:0;
}

.component-banner > .banner-pagi > .pagicover > .cover > .dots   div > span {
  display:block;
  position:relative;
  width:.6rem;
  height:.6rem;
  border-radius:80px;
  -webkit-border-radius:80px;
  background:#fff3;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
}

.component-banner > .banner-pagi > .pagicover > .cover > .arrows {
  display:block;
  position:relative;
  float:left;
}

.component-banner > .banner-pagi > .pagicover > .cover > .arrows > div {
  width:4rem;
  height:2.6rem;
  display:block;
  position:relative;
  float:left;
  margin:0px .62rem 0px 0px;
  cursor:pointer;
  background:#ffffff0a;
  border-radius:80px;
  -webkit-border-radius:80px;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  border:solid 1px rgba(255,255,255,.04);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}

.component-banner > .banner-pagi > .pagicover > .cover > .arrows > div:hover {
  background:#fff3;
}

.component-banner > .banner-pagi > .pagicover > .cover > .arrows > div:last-child {
  margin:0;
}

.component-banner > .banner-pagi > .pagicover > .cover > .arrows > div > i {
  display:block;
  position:absolute;
  width:1.2rem;
  height:1.2rem;
  line-height:1.2rem;
  font-size:1.2rem;
  text-align:center;
  top:calc(50% - .6rem);
  left:calc(50% - .6rem);
}

@media only screen and (max-width: 860px) {
  .component-banner > .swiper   .box {
    padding:6.5rem 0px 0px;
  }
  .component-banner > .swiper   .box > .content {
    position:relative;
    padding:0px 10rem;
    top:auto;
    left:auto;
    z-index:1;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover {
    text-align:center;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > h1 {
    width:100%;
    font-size:6.5rem;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > h2 {
    width:100%;
    font-size:6.5rem;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > p {
    width:100%;
    font-size:2.5rem;
    margin:3rem 0px 0px;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > .wptbutton {
    margin:7rem 0px 0px;
  }
  .component-banner > .swiper   .box > .image {
    position:absolute;
    width:100%;
    bottom:0;
    left:0;
  }
  .component-banner > .swiper   .box > .image > img.desktop {
    display:none;
  }
  .component-banner > .swiper   .box > .image > img.mobile {
    display:block;
  }
  .component-banner > .banner-pagi {
    height:1.75rem;
    bottom:6rem;
  }
  .component-banner > .banner-pagi > .pagicover {
    height:1.75rem;
    text-align:center;
  }
  .component-banner > .banner-pagi > .pagicover > .cover {
    display:inline-block;
    float:none;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots {
    display:block;
    position:relative;
    float:left;
    margin:0;
    height:1.75rem;
    text-align:right;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div {
    height:1.75rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div.active {
    width:4.5rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div.active > span {
    width:4.5rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div:last-child {
    margin:0;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div > span {
    width:1.75rem;
    height:1.75rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .arrows {
    display:none;
  }
}

@media only screen and (max-width: 520px) {
  .component-banner > .swiper   .box {
    padding:8rem 0px 0px;
  }
  .component-banner > .swiper   .box > .content {
    padding:0px 8rem;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > h1 {
    font-size:8.5rem;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > h2 {
    font-size:8.5rem;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > p {
    font-size:4rem;
    margin:4rem 0px 0px;
  }
  .component-banner > .swiper   .box > .content > .contentcover > .cover > .wptbutton {
    margin:6rem 0px 0px;
  }
  .component-banner > .swiper   .box > .image {
    width:calc(100% + 40rem);
    left:-20rem;
  }
  .component-banner > .banner-pagi {
    height:2rem;
    bottom:0;
  }
  .component-banner > .banner-pagi > .pagicover {
    height:2rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots {
    height:2rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div {
    height:2rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div.active {
    width:5rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div.active > span {
    width:5rem;
  }
  .component-banner > .banner-pagi > .pagicover > .cover > .dots   div > span {
    width:2rem;
    height:2rem;
  }
}

.component-promotions {
  display:block;
  position:relative;
  width:100%;
}

.component-promotions > .head {
  display:block;
  position:relative;
  max-width:51.2rem;
  width:100%;
  margin:0px auto 3rem;
}

.component-promotions > .head > .description {
  display:block;
  position:relative;
  width:100%;
  margin:1rem 0px 0px;
  font-size:1.2rem;
}

.component-promotions > .list {
  display:flex;
  gap:2.18rem;
  position:relative;
  width:100%;
}

.component-promotions > .list   .box {
  display:block;
  position:relative;
  width:100%;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  border:solid 1px rgba(255,255,255,.06);
  border-radius:1rem;
  -webkit-border-radius:1rem;
  overflow:hidden;
  background:#221312;
  padding:0px 0px 6.6rem;
}

.component-promotions > .list   .box > .image {
  display:block;
  position:relative;
  width:100%;
  height:13rem;
  line-height:0px;
  overflow:hidden;
  z-index:1;
}

.component-promotions > .list   .box > .image > img {
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  object-fit:cover;
  top:0;
  left:0;
}

.component-promotions > .list   .box > .content {
  display:block;
  position:relative;
  width:100%;
  text-align:left;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:1.6rem 2rem 0px 1.6rem;
}

.component-promotions > .list   .box > .content > .shadow {
  display:block;
  position:absolute;
  width:1rem;
  height:1rem;
  background:#581c19;
  border-radius:50%;
  -webkit-border-radius:50%;
  box-shadow:0 0 8rem 8rem #581c19;
  -webkit-box-shadow:0px 0px 8rem 8rem rgb(88,28,25);
  top:-4rem;
  left:3rem;
}

.component-promotions > .list   .box > .content > p {
  margin:.5rem 0px 0px;
}

.component-promotions > .list   .box > .action {
  display:block;
  position:absolute;
  width:calc(100% - 4rem);
  bottom:1.75rem;
  left:2rem;
  overflow:hidden;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

.component-promotions > .list   .box > .action > .wptbutton {
  display:block;
  float:left;
  margin:0px 2.3rem 0px 0px;
}

.component-promotions > .list   .box > .action > .wptbutton > a {
  height:2.6rem;
  padding:0px 3rem;
}

.component-promotions > .list   .box > .action > .wptbutton > a > div {
  font-size:.8rem;
}

.component-promotions > .list   .box > .action > .view {
  display:block;
  position:relative;
  float:left;
}

.component-promotions > .list   .box > .action > .view > a {
  display:flex;
  position:relative;
  width:100%;
  height:2.6rem;
  align-items:center;
  color:#ec9f87;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
}

.component-promotions > .list   .box > .action > .view > a:hover {
  color:#fff;
}

.component-promotions > .list   .box > .action > .view > a > span {
  display:block;
  position:relative;
  line-height:100%;
  width:100%;
  font-size:.8rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:0px 1.6rem 0px 0px;
}

.component-promotions > .list   .box > .action > .view > a > span > i {
  display:block;
  position:absolute;
  width:1.2rem;
  height:1.2rem;
  line-height:1.2rem;
  font-size:1.2rem;
  top:-.1rem;
  right:0;
}

@media only screen and (max-width: 860px) {
  .component-promotions > .head {
    max-width:60%;
    margin:0px auto 6rem;
  }
  .component-promotions > .head > .description {
    margin:2rem 0px 0px;
    font-size:2.5rem;
  }
  .component-promotions > .list {
    display:block;
    gap:0rem;
  }
  .component-promotions > .list   .box {
    margin:0px 0px 3rem;
    padding:0 0 0 44.5%;
  }
  .component-promotions > .list   .box:last-child {
    margin:0;
  }
  .component-promotions > .list   .box > .image {
    position:absolute;
    height:100%;
    top:0;
    left:0;
    width:44.5%;
  }
  .component-promotions > .list   .box > .content {
    padding:2.5rem 3rem;
  }
  .component-promotions > .list   .box > .content > .shadow {
    box-shadow:0 0 20rem 20rem #581c19;
    -webkit-box-shadow:0px 0px 20rem 20rem rgb(88,28,25);
  }
  .component-promotions > .list   .box > .content > p {
    margin:1.5rem 0px 0px;
  }
  .component-promotions > .list   .box > .action {
    position:relative;
    width:100%;
    bottom:auto;
    left:auto;
    padding:3rem;
    margin:1.5rem 0px 0px;
  }
  .component-promotions > .list   .box > .action > .wptbutton > a {
    height:5.6rem;
    padding:0px 6rem;
  }
  .component-promotions > .list   .box > .action > .wptbutton > a > div {
    font-size:1.8rem;
  }
  .component-promotions > .list   .box > .action > .view > a {
    height:5.6rem;
  }
  .component-promotions > .list   .box > .action > .view > a > span {
    padding:0px 3rem 0px 0px;
  }
  .component-promotions > .list   .box > .action > .view > a > span > i {
    width:2.4rem;
    height:2.4rem;
    line-height:2.4rem;
    font-size:2.4rem;
    top:-.12rem;
  }
}

@media only screen and (max-width: 520px) {
  .component-promotions > .head {
    max-width:100%;
    margin:0px auto 8rem;
  }
  .component-promotions > .head > .description {
    margin:4rem 0px 0px;
    font-size:4rem;
  }
  .component-promotions > .list   .box {
    margin:0px 0px 5rem;
    padding:0;
    border-radius:3.5rem;
    -webkit-border-radius:3.5rem;
  }
  .component-promotions > .list   .box > .image {
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    height:38rem;
  }
  .component-promotions > .list   .box > .content {
    width:100%;
    padding:3rem 4rem;
  }
  .component-promotions > .list   .box > .content > .shadow {
    box-shadow:0 0 40rem 40rem #581c19;
    -webkit-box-shadow:0px 0px 40rem 40rem rgb(88,28,25);
  }
  .component-promotions > .list   .box > .content > p {
    margin:2rem 0px 0px;
  }
  .component-promotions > .list   .box > .action {
    margin:1.5rem 0px 0px;
  }
  .component-promotions > .list   .box > .action > .wptbutton > a {
    height:9rem;
    padding:0px 8rem;
  }
  .component-promotions > .list   .box > .action > .wptbutton > a > div {
    font-size:3.5rem;
  }
  .component-promotions > .list   .box > .action > .view {
    float:right;
  }
  .component-promotions > .list   .box > .action > .view > a {
    height:10rem;
  }
  .component-promotions > .list   .box > .action > .view > a > span {
    padding:0px 5rem 0px 0px;
  }
  .component-promotions > .list   .box > .action > .view > a > span > i {
    width:4rem;
    height:4rem;
    line-height:4rem;
    font-size:4rem;
    top:calc(50% - 2rem);
  }
}

.component-contentcolumn1 {
  display:block;
  position:relative;
  width:100%;
}

.component-contentcolumn1 > .content {
  display:flex;
  position:relative;
  width:100%;
}

.component-contentcolumn1 > .content > img.top {
  display:none;
  position:relative;
  width:80%;
  margin:0 auto;
}

.component-contentcolumn1 > .content > .title {
  display:flex;
  align-items:center;
  position:relative;
  width:22rem;
  margin:0px 5rem 0px 0px;
}

.component-contentcolumn1 > .content > .description {
  display:flex;
  align-items:center;
  position:relative;
  font-size:1.2rem;
  width:calc(100% - 57rem);
  margin:0px 3rem 0px 0px;
}

.component-contentcolumn1 > .content > img.bottom {
  display:block;
  position:relative;
  width:27rem;
}

.component-contentcolumn1 > .content > img.mid {
  display:none;
  position:relative;
  width:70%;
  margin:5rem auto 0px;
}

.component-contentcolumn1 > .line {
  display:block;
  position:absolute;
  width:100%;
  height:1px;
  background:#0000;
  background:-webkit-linear-gradient(90deg,rgba(0,0,0,.01) 0%,rgba(62,56,56,.2) 30%,rgba(62,56,56,.2) 70%,rgba(0,0,0,0) 100%);
  background:-moz-linear-gradient(90deg,rgba(0,0,0,.01) 0%,rgba(62,56,56,.2) 30%,rgba(62,56,56,.2) 70%,rgba(0,0,0,0) 100%);
  background:linear-gradient(90deg,#00000003,#3e383833 30% 70%,#0000);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000",endColorstr="#00000000",GradientType=1);
  bottom:0;
  left:0;
}

@media only screen and (max-width: 860px) {
  .component-contentcolumn1 > .content {
    display:block;
    gap:0rem;
    text-align:center;
  }
  .component-contentcolumn1 > .content > .title {
    display:block;
    width:80%;
    margin:0 auto;
  }
  .component-contentcolumn1 > .content > .description {
    display:block;
    font-size:2.5rem;
    width:80%;
    margin:2rem auto 0px;
  }
  .component-contentcolumn1 > .content > img.bottom {
    display:none;
  }
  .component-contentcolumn1 > .content > img.mid {
    display:block;
  }
  .component-contentcolumn1 > .line {
    display:none;
  }
}

@media only screen and (max-width: 520px) {
  .component-contentcolumn1 > .content > img.top {
    display:block;
    width:70%;
  }
  .component-contentcolumn1 > .content > img.mid {
    display:none;
  }
  .component-contentcolumn1 > .content > img.bottom {
    display:none;
  }
  .component-contentcolumn1 > .content > .title {
    width:100%;
    margin:-6rem 0px 0px;
  }
  .component-contentcolumn1 > .content > .description {
    font-size:4rem;
    width:100%;
    margin:4rem auto 0px;
  }
  .component-contentcolumn1 > .line {
    display:none;
  }
}

.component-tournamentcarousel {
  display:block;
  position:relative;
  width:100%;
}

.component-tournamentcarousel > .title {
  display:block;
  position:relative;
  width:100%;
  margin:0px 0px 2.6rem;
}

.component-tournamentcarousel > .carousel {
  display:block;
  position:relative;
  width:calc(100% + 2.24rem);
  margin:0px -1.12rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

.component-tournamentcarousel > .carousel > .swiper   a.box {
  display:block;
  position:relative;
  width:100%;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:2rem 1.12rem 0px;
}

.component-tournamentcarousel > .carousel > .swiper   a.box.none {
  pointer-events:none!important;
}

.component-tournamentcarousel > .carousel > .swiper   a.box:hover > .image {
  top:.4rem;
}

.component-tournamentcarousel > .carousel > .swiper   a.box:hover > .cover > .shadow > div {
  width:5rem;
  left:calc(50% - 2.5rem);
}

.component-tournamentcarousel > .carousel > .swiper   a.box:hover > .cover > .text {
  bottom:1.62rem;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .image {
  display:block;
  position:absolute;
  width:100%;
  line-height:0px;
  z-index:1;
  top:0;
  left:0;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .image > img {
  display:block;
  position:relative;
  max-height:10.4rem;
  margin:0 auto;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover {
  display:block;
  position:relative;
  width:100%;
  height:13rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  border-radius:1.25rem;
  -webkit-border-radius:1.25rem;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .shadow {
  display:block;
  position:absolute;
  top:0;
  left:0;
  border-radius:1.25rem;
  -webkit-border-radius:1.25rem;
  width:100%;
  height:100%;
  overflow:hidden;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .shadow > div {
  display:block;
  position:absolute;
  width:6.15rem;
  height:.125rem;
  border-radius:1.25rem;
  -webkit-border-radius:1.25rem;
  top:calc(50% - .06rem);
  left:calc(50% - 3.125rem);
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .overlay {
  display:block;
  position:absolute;
  top:0;
  left:0;
  border-radius:1.25rem;
  -webkit-border-radius:1.25rem;
  width:100%;
  height:100%;
  overflow:hidden;
  z-index:2;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .overlay > div {
  display:block;
  position:absolute;
  width:calc(100% + 12.5rem);
  height:3.75rem;
  left:-6.25rem;
  bottom:0;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text {
  display:block;
  position:absolute;
  width:100%;
  z-index:3;
  bottom:1.32rem;
  left:0;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover {
  display:block;
  position:relative;
  width:100%;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover > div {
  display:block;
  position:relative;
  width:100%;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover > div > p {
  white-space:nowrap;
  background:#fabd48;
  background:linear-gradient(to bottom,#fabd48,#fff);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font-size:2.6rem;
  font-weight:800;
  bottom:-.5rem;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover > div > p   span {
  margin:0px -.4rem;
  font-size:1.6rem;
  font-weight:600;
}

.component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover > span {
  display:block;
  position:relative;
  font-size:1.3rem;
  width:100%;
  text-transform:uppercase;
}

.component-tournamentcarousel > .carousel > .prev {
  display:block;
  position:absolute;
  width:3.5rem;
  height:2.5rem;
  border-radius:80px;
  -webkit-border-radius:80px;
  background:#241b1b;
  top:calc(50% - .375rem);
  left:-3rem;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
  cursor:pointer;
  z-index:1;
}

.component-tournamentcarousel > .carousel > .prev:hover {
  background:#332626;
}

.component-tournamentcarousel > .carousel > .prev > i {
  display:block;
  position:absolute;
  width:1rem;
  height:1rem;
  line-height:1rem;
  text-align:center;
  font-size:1rem;
  top:calc(50% - .5rem);
  left:calc(50% - .5rem);
}

.component-tournamentcarousel > .carousel > .next {
  display:block;
  position:absolute;
  width:3.5rem;
  height:2.5rem;
  border-radius:80px;
  -webkit-border-radius:80px;
  background:#241b1b;
  top:calc(50% - .375rem);
  right:-3rem;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
  cursor:pointer;
  z-index:1;
}

.component-tournamentcarousel > .carousel > .next:hover {
  background:#332626;
}

.component-tournamentcarousel > .carousel > .next > i {
  display:block;
  position:absolute;
  width:16px;
  height:16px;
  line-height:16px;
  text-align:center;
  font-size:16px;
  top:calc(50% - 8px);
  left:calc(50% - 8px);
}

.component-tournamentcarousel > .list {
  display:none;
  position:relative;
  width:100%;
}

.component-tournamentcarousel > .list   .box {
  display:block;
  position:relative;
  width:100%;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:4rem 0px 0px;
  margin:0px 0px 1.5rem;
}

.component-tournamentcarousel > .list   .box.none {
  pointer-events:none!important;
}

.component-tournamentcarousel > .list   .box:last-child {
  margin:0;
}

.component-tournamentcarousel > .list   .box > .cover {
  display:block;
  position:relative;
  width:100%;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  border-radius:3.5rem;
  -webkit-border-radius:3.5rem;
}

.component-tournamentcarousel > .list   .box > .cover > .shadow {
  display:block;
  position:absolute;
  top:0;
  left:0;
  border-radius:3.5rem;
  -webkit-border-radius:3.5rem;
  width:100%;
  height:100%;
  overflow:hidden;
}

.component-tournamentcarousel > .list   .box > .cover > .shadow > div {
  display:block;
  position:absolute;
  width:8rem;
  height:.2rem;
  border-radius:80px;
  -webkit-border-radius:80px;
  top:-1rem;
  left:calc(50% - 4rem);
}

.component-tournamentcarousel > .list   .box > .cover > img {
  display:block;
  position:relative;
  width:28rem;
  float:left;
  border-radius:0px 0px 0px 3.5rem;
  -webkit-border-radius:0px 0px 0px 3.5rem;
  z-index:3;
  margin:-4rem 0px 0px;
}

.component-tournamentcarousel > .list   .box > .cover > .text {
  display:flex;
  position:absolute;
  align-items:center;
  width:calc(100% - 28rem);
  height:100%;
  top:0;
  right:0;
  z-index:3;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:1rem 4rem;
  text-align:left;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover {
  display:block;
  position:relative;
  width:100%;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover > div {
  display:block;
  position:relative;
  width:100%;
  margin:-1.5rem 0px 0px;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover > div > p {
  white-space:nowrap;
  background:#fabd48;
  background:linear-gradient(to bottom,#fabd48,#fff);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font-size:6rem;
  font-weight:800;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover > div > p   span {
  font-size:4.5rem;
  font-weight:600;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover > div > p   span:nth-child(1) {
  margin:0px -1rem 0px 0px;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover > div > p   span:nth-child(2) {
  margin:0px 0px 0px -.6rem;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover > span {
  display:block;
  position:relative;
  font-size:3rem;
  width:100%;
  text-transform:uppercase;
}

.component-tournamentcarousel > .list   .box > .cover > .text > .textcover > i {
  display:block;
  position:absolute;
  width:6rem;
  height:6rem;
  line-height:6rem;
  font-size:6rem;
  top:calc(50% - 3rem);
  right:0;
}

.component-tournamentcarousel > .list   .box > .cover > i {
  display:block;
  position:absolute;
  width:4rem;
  height:4rem;
  line-height:4rem;
  text-align:center;
  font-size:4rem;
  top:calc(50% - 2rem);
  right:4rem;
  opacity:.4;
}

.component-tournamentcarousel > .description {
  display:block;
  position:relative;
  width:100%;
  max-width:52rem;
  margin:2.4rem auto 0px;
  font-size:1.2rem;
}

.component-tournamentcarousel > .link {
  display:block;
  position:relative;
  margin:1.6rem 0px 0px;
  width:100%;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
  opacity:.4;
  pointer-events:none;
}

.component-tournamentcarousel > .link.active {
  opacity:1;
  pointer-events:unset;
}

.component-tournamentcarousel > .link > a {
  display:inline-block;
  position:relative;
  line-height:100%;
  color:#ec9f87;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:0px 1.5rem 0px 0px;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
  cursor:pointer;
}

.component-tournamentcarousel > .link > a:hover {
  color:#fff;
}

.component-tournamentcarousel > .link > a:hover > i {
  right:-.125rem;
}

.component-tournamentcarousel > .link > a > i {
  display:block;
  position:absolute;
  width:1rem;
  height:1rem;
  line-height:1rem;
  font-size:1rem;
  top:.18rem;
  right:0;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
}

@media only screen and (max-width: 860px) {
  .component-tournamentcarousel {
    max-width:100%;
  }
  .component-tournamentcarousel > .title {
    margin:0px 0px 6rem;
  }
  .component-tournamentcarousel > .carousel {
    display:block;
    position:relative;
    width:100%;
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
  }
  .component-tournamentcarousel > .carousel.pagi {
    padding:0;
  }
  .component-tournamentcarousel > .carousel > .swiper   .swiper-slide {
    width:auto!important;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box {
    display:block;
    position:relative;
    width:43rem;
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    padding:10rem 1.5rem 0px;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box:hover > .image {
    top:1rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box:hover > .cover > .shadow > div {
    width:16rem;
    height:8rem;
    top:calc(50% - 4rem);
    left:calc(50% - 6rem);
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box:hover > .cover > .overlay {
    opacity:.9;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box:hover > .cover > .overlay > div {
    height:11rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box:hover > .cover > .text {
    bottom:3rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .image > img {
    max-height:21rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover {
    height:24rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .shadow > div {
    width:16rem;
    height:8rem;
    top:calc(50% - 4rem);
    left:calc(50% - 6rem);
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .overlay {
    opacity:.9;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .overlay > div {
    height:11rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text {
    bottom:3rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover > div > p {
    font-size:5rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover > div > p   span {
    margin:0px -.5rem;
    font-size:3rem;
  }
  .component-tournamentcarousel > .carousel > .swiper   a.box > .cover > .text > .textcover > span {
    font-size:1.75rem;
  }
  .component-tournamentcarousel > .carousel > .prev {
    display:none;
  }
  .component-tournamentcarousel > .carousel > .next {
    display:none;
  }
  .component-tournamentcarousel > .description {
    max-width:90%;
    margin:7rem auto 0px;
    font-size:2.5rem;
  }
  .component-tournamentcarousel > .link {
    margin:4rem 0px 0px;
  }
  .component-tournamentcarousel > .link > a {
    padding:0px 2.5rem 0px 0px;
  }
  .component-tournamentcarousel > .link > a:hover {
    color:#fff;
  }
  .component-tournamentcarousel > .link > a:hover > i {
    right:-.5rem;
  }
  .component-tournamentcarousel > .link > a > i {
    width:2rem;
    height:2rem;
    line-height:2rem;
    font-size:2rem;
    top:.05rem;
  }
}

@media only screen and (max-width: 520px) {
  .component-tournamentcarousel > .title {
    width:100%;
    margin:0px auto 5rem;
  }
  .component-tournamentcarousel > .carousel {
    display:none;
  }
  .component-tournamentcarousel > .list {
    display:block;
  }
  .component-tournamentcarousel > .description {
    font-size:4rem;
    max-width:100%;
    margin:6rem 0px 0px;
  }
  .component-tournamentcarousel > .link {
    margin:6rem 0px 0px;
  }
  .component-tournamentcarousel > .link > a {
    padding:0px 5rem 0px 0px;
    font-size:4rem;
  }
  .component-tournamentcarousel > .link > a:hover > i {
    right:0;
  }
  .component-tournamentcarousel > .link > a > i {
    width:4rem;
    height:4rem;
    line-height:4rem;
    font-size:4rem;
    top:calc(50% - 1.4rem);
  }
}

.component-descriptionbox1 {
  display:block;
  position:relative;
  width:100%;
}

.component-descriptionbox1 > .title {
  display:block;
  position:relative;
  width:100%;
  margin:0px 0px 3rem;
}

.component-descriptionbox1 > .column {
  display:flex;
  gap:2.18rem;
  position:relative;
  width:100%;
}

.component-descriptionbox1 > .column   .box {
  display:block;
  position:relative;
  width:100%;
  border:solid 1px rgba(255,255,255,.06);
  border-radius:1.25rem;
  -webkit-border-radius:1.25rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  background:#1b1111;
  overflow:hidden;
}

.component-descriptionbox1 > .column   .box > span {
  display:block;
  position:absolute;
  width:.25rem;
  height:.25rem;
  border-radius:50%;
  -webkit-border-radius:50%;
  box-shadow:0 0 8rem 8rem #953d20;
  -webkit-box-shadow:0px 0px 8rem 8rem rgb(149,61,32);
  top:calc(50% + 1.5rem);
  left:-.25rem;
  z-index:1;
}

.component-descriptionbox1 > .column   .box > .text {
  display:block;
  position:relative;
  width:100%;
  z-index:2;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:2rem 2rem 0px;
  margin:0px 0px 2rem;
}

.component-descriptionbox1 > .column   .box > .text > .cover {
  display:block;
  position:relative;
  width:100%;
}

.component-descriptionbox1 > .column   .box > .text > .cover > h3 {
  background:#fabd48;
  background:linear-gradient(to bottom,#fabd48,#fff);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.component-descriptionbox1 > .column   .box > .text > .cover > .desc {
  display:block;
  position:relative;
  width:100%;
  margin:.75rem 0px 0px;
}

.component-descriptionbox1 > .column   .box > .space {
  display:block;
  position:relative;
  width:100%;
  height:12rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

.component-descriptionbox1 > .column   .box > img {
  display:block;
  position:absolute;
  width:18.8rem;
  left:calc(50% - 9.4rem);
  bottom:-2.2rem;
  z-index:1;
}

.component-descriptionbox1 > .carousel {
  display:none;
  position:relative;
  width:100%;
  overflow:hidden;
}

.component-descriptionbox1 > .carousel > .cover {
  display:block;
  position:relative;
  width:100%;
}

.component-descriptionbox1 > .carousel > .cover > .swiper   .box {
  display:block;
  position:relative;
  width:78rem;
  height:84rem;
  border:solid 1px #2B2222;
  border-radius:3.5rem;
  -webkit-border-radius:3.5rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  background:#1b1111;
  overflow:hidden;
  margin:0px 4rem 0px 0px;
}

.component-descriptionbox1 > .carousel > .cover > .swiper   .box > span {
  display:block;
  position:absolute;
  width:1rem;
  height:1rem;
  border-radius:50%;
  -webkit-border-radius:50%;
  box-shadow:0 0 36rem 36rem #953d20;
  -webkit-box-shadow:0px 0px 36rem 36rem rgb(149,61,32);
  bottom:2rem;
  left:-1rem;
  z-index:1;
}

.component-descriptionbox1 > .carousel > .cover > .swiper   .box > .text {
  display:block;
  position:relative;
  width:100%;
  z-index:2;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:6rem;
  margin:0px 0px 2rem;
  text-align:left;
}

.component-descriptionbox1 > .carousel > .cover > .swiper   .box > .text > .cover {
  display:block;
  position:relative;
  width:100%;
}

.component-descriptionbox1 > .carousel > .cover > .swiper   .box > .text > .cover > h4 {
  background:#fabd48;
  background:linear-gradient(to bottom,#fabd48,#fff);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.component-descriptionbox1 > .carousel > .cover > .swiper   .box > .text > .cover > .desc {
  display:block;
  position:relative;
  width:100%;
  margin:4rem 0px 0px;
}

.component-descriptionbox1 > .carousel > .cover > .swiper   .box > img {
  display:block;
  position:absolute;
  width:62rem;
  left:calc(50% - 29rem);
  bottom:-6rem;
  z-index:1;
  opacity:.6;
}

.component-descriptionbox1 > .carousel > .pagi {
  display:block;
  position:relative;
  width:100%;
  height:2rem;
  text-align:center;
  margin:5rem 0px 0px;
}

.component-descriptionbox1 > .carousel > .pagi > .cover {
  display:block;
  position:relative;
  width:100%;
  height:2rem;
  line-height:0px;
  text-align:center;
}

.component-descriptionbox1 > .carousel > .pagi > .cover   div {
  display:inline-block;
  position:relative;
  height:2rem;
  margin:0px 1rem 0px 0px;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

.component-descriptionbox1 > .carousel > .pagi > .cover   div.active {
  width:6rem;
}

.component-descriptionbox1 > .carousel > .pagi > .cover   div.active > span {
  width:6rem;
  background:#ffffffe6;
}

.component-descriptionbox1 > .carousel > .pagi > .cover   div:last-child {
  margin:0;
}

.component-descriptionbox1 > .carousel > .pagi > .cover   div > span {
  display:block;
  position:relative;
  width:2rem;
  height:2rem;
  border-radius:80px;
  -webkit-border-radius:80px;
  background:#ffffff80;
  transition:all .2s ease;
  -webkit-transition:all .2s ease;
}

@media only screen and (max-width: 860px) {
  .component-descriptionbox1 > .title {
    width:80%;
    margin:0px auto 6rem;
  }
  .component-descriptionbox1 > .column {
    display:block;
    gap:0rem;
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    padding:0px 4rem;
  }
  .component-descriptionbox1 > .column   .box {
    margin:0px 0px 3rem;
    border-radius:2.5rem;
    -webkit-border-radius:2.5rem;
  }
  .component-descriptionbox1 > .column   .box:last-child {
    margin:0;
  }
  .component-descriptionbox1 > .column   .box:nth-child(odd) > span {
    left:auto;
    right:0;
  }
  .component-descriptionbox1 > .column   .box:nth-child(2n) > .text {
    float:right;
  }
  .component-descriptionbox1 > .column   .box:nth-child(2n) > img {
    left:0rem;
    right:auto;
  }
  .component-descriptionbox1 > .column   .box > span {
    box-shadow:0 0 12rem 12rem #953d20;
    -webkit-box-shadow:0px 0px 12rem 12rem rgb(149,61,32);
    top:-.25rem;
    left:-.25rem;
  }
  .component-descriptionbox1 > .column   .box > .text {
    width:calc(100% - 34rem);
    padding:8rem 4rem;
    margin:0;
  }
  .component-descriptionbox1 > .column   .box > .text > .cover {
    text-align:left;
  }
  .component-descriptionbox1 > .column   .box > .text > .cover > .desc {
    margin:1.6rem 0px 0px;
  }
  .component-descriptionbox1 > .column   .box > .space {
    display:none;
  }
  .component-descriptionbox1 > .column   .box > img {
    width:auto;
    height:28rem;
    left:auto;
    right:0rem;
    bottom:auto;
    top:calc(50% - 13rem);
  }
}

@media only screen and (max-width: 520px) {
  .component-descriptionbox1 > .title {
    width:100%;
    margin:0px auto 8rem;
  }
  .component-descriptionbox1 > .column {
    display:none;
  }
  .component-descriptionbox1 > .carousel {
    display:block;
  }
}

.component-descriptionbox2 {
  display:block;
  position:relative;
  width:100%;
}

.component-descriptionbox2 > .title {
  display:block;
  position:relative;
  width:100%;
  margin:0px 0px 3rem;
}

.component-descriptionbox2 > .title > .description {
  display:block;
  position:relative;
  width:100%;
  font-size:1.2rem;
  margin:1rem 0px 0px;
}

.component-descriptionbox2 > .column {
  display:flex;
  gap:2.18rem;
  position:relative;
  width:100%;
}

.component-descriptionbox2 > .column   .box {
  display:block;
  position:relative;
  width:100%;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:1.75rem 2rem;
  border-radius:1.25rem;
  -webkit-border-radius:1.25rem;
  overflow:hidden;
}

.component-descriptionbox2 > .column   .box > img {
  display:inline-block;
  position:relative;
  width:4.5rem;
  z-index:2;
}

.component-descriptionbox2 > .column   .box > .text {
  display:block;
  position:relative;
  width:100%;
  margin:1rem 0px 0px;
}

.component-descriptionbox2 > .column   .box > .text > div {
  display:block;
  position:relative;
  width:100%;
}

.component-descriptionbox2 > .column   .box > .text > div > h3 {
  z-index:2;
}

.component-descriptionbox2 > .column   .box > .text > div > .desc {
  display:block;
  position:relative;
  width:85%;
  z-index:2;
  margin:.65rem auto 0px;
}

.component-descriptionbox2 > .column   .box > .top {
  display:block;
  position:absolute;
  width:36%;
  height:.6rem;
  border-radius:50%;
  -webkit-border-radius:50%;
  top:-2.5rem;
  left:32%;
  z-index:1;
}

.component-descriptionbox2 > .column   .box > .overlay {
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  z-index:1;
  background:#fff0;
  background:-webkit-linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(0,0,0,.4) 100%);
  background:-moz-linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(0,0,0,.4) 100%);
  background:linear-gradient(180deg,#fff0,#0006);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr = "#FFFFFF00",endColorstr = "#000000",GradientType = 0);
}

.component-descriptionbox2 > .column   .box > span {
  display:block;
  position:absolute;
  width:36%;
  height:.6rem;
  border-radius:50%;
  -webkit-border-radius:50%;
  background:#1e1212;
  box-shadow:0 0 6.25rem 6.25rem #1e1212;
  -webkit-box-shadow:0px 0px 6.25rem 6.25rem rgb(30,18,18);
  bottom:-2.5rem;
  left:32%;
}

.component-descriptionbox2 > .carousel {
  display:none;
  position:relative;
  width:100%;
}

.component-descriptionbox2 > .carousel > .cover {
  display:block;
  position:relative;
  width:100%;
}

.component-descriptionbox2 > .carousel > .cover   .box {
  display:block;
  position:relative;
  width:78rem;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  padding:4.5rem 5rem;
  border-radius:3.5rem;
  -webkit-border-radius:3.5rem;
  overflow:hidden;
  text-align:left;
  margin:0px 4rem 0px 0px;
}

.component-descriptionbox2 > .carousel > .cover   .box > img {
  display:block;
  position:relative;
  width:12.4rem;
  z-index:2;
}

.component-descriptionbox2 > .carousel > .cover   .box > .text {
  display:block;
  position:relative;
  width:100%;
  margin:2rem 0px 0px;
  z-index:2;
}

.component-descriptionbox2 > .carousel > .cover   .box > .text > .desc {
  display:block;
  position:relative;
  width:100%;
  margin:2rem 0px 0px;
}

.component-descriptionbox2 > .carousel > .cover   .box > .top {
  display:block;
  position:absolute;
  width:36%;
  height:10px;
  border-radius:50%;
  -webkit-border-radius:50%;
  top:-40px;
  left:32%;
  z-index:1;
}

.component-descriptionbox2 > .carousel > .cover   .box > .overlay {
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  z-index:1;
  background:#fff0;
  background:-webkit-linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(0,0,0,.4) 100%);
  background:-moz-linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(0,0,0,.4) 100%);
  background:linear-gradient(180deg,#fff0,#0006);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF00",endColorstr="#000000",GradientType=0);
}

.component-descriptionbox2 > .carousel > .cover   .box > span {
  display:block;
  position:absolute;
  width:36%;
  height:10px;
  border-radius:50%;
  -webkit-border-radius:50%;
  background:#1e1212;
  box-shadow:0 0 100px 100px #1e1212;
  -webkit-box-shadow:0px 0px 100px 100px rgb(30,18,18);
  bottom:-40px;
  left:32%;
}

.component-descriptionbox2 > .wptbutton {
  margin:2rem 0px 0px;
}

@media only screen and (max-width: 860px) {
  .component-descriptionbox2 > .title {
    width:80%;
    margin:0px auto 6rem;
  }
  .component-descriptionbox2 > .title > .description {
    font-size:2.5rem;
    margin:2rem 0px 0px;
  }
  .component-descriptionbox2 > .column {
    display:block;
    gap:0px;
  }
  .component-descriptionbox2 > .column   .box {
    padding:0px 3rem;
    margin:0px 0px 3rem;
    border-radius:2.5rem;
    -webkit-border-radius:2.5rem;
    height:19.2rem;
  }
  .component-descriptionbox2 > .column   .box:last-child {
    margin:0;
  }
  .component-descriptionbox2 > .column   .box > img {
    display:block;
    position:absolute;
    width:auto;
    height:11.4rem;
    left:3rem;
    top:calc(50% - 5.7rem);
  }
  .component-descriptionbox2 > .column   .box > .text {
    display:flex;
    height:100%;
    align-items:center;
    width:calc(100% - 15rem);
    float:right;
    margin:0;
    text-align:left;
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
  }
  .component-descriptionbox2 > .column   .box > .text > div > .desc {
    margin:1.5rem 0px 0px;
  }
  .component-descriptionbox2 > .column   .box > span {
    width:20%;
    bottom:-1.5rem;
    left:40%;
  }
  .component-descriptionbox2 > .wptbutton {
    margin:6rem 0px 0px;
  }
}

@media only screen and (max-width: 520px) {
  .component-descriptionbox2 > .title {
    width:100%;
    margin:0px auto 8rem;
  }
  .component-descriptionbox2 > .title > .description {
    font-size:4rem;
    margin:4rem 0px 0px;
  }
  .component-descriptionbox2 > .column {
    display:none;
  }
  .component-descriptionbox2 > .carousel {
    display:block;
  }
  .component-descriptionbox2 > .wptbutton {
    margin:6rem 0px 0px;
    width:100%;
  }
}