@charset "utf-8";

html,
body {
    background: #fff;
    scroll-behavior: smooth;
}
body > nav {
    background: #fff;
}

img {
    max-width: 100%;
}

.container {
    max-width: 1224px;
    width: 100%;
    margin: 0 auto;
}

.digiarty-timer {font-size: 41px;color: #ffae00;line-height: 78px;text-align: center;margin: 10px 0 35px;}
.digiarty-timer li {display: inline-block; vertical-align: top; width: 86px; height: 76px; border: 1px solid #ffffff; font-size: 41px;line-height: 55px;text-align: center;border-radius: 4px; position: relative;background-color: #ffffff;color: #ffae00;}
.digiarty-timer li::after {width: 100%;font-size: 17px;text-align: center;line-height: 17px;position: absolute;bottom: 4px;left: 0;color: #62676a;}
.digiarty-timer li[data-provider="days"]::after {content: "DAY";}
.digiarty-timer li[data-provider="hours"]::after {content: "HOUR"}
.digiarty-timer li[data-provider="minutes"]::after {content: "MINS"}
.digiarty-timer li[data-provider="seconds"]::after {content: "SECS"}

.banner-wrapper .switch-system{position:absolute;right:20px;top:20px;}
.switch-flex{display:flex;justify-content:center;align-items:center;gap:10px;}
.switch-wrapper{display:inline-block;height:15px;margin:0;position:relative;width:32px;}
.switch-wrapper input{height:0;opacity:0;width:0;}
.switch-slider{background-color:#ffffff;border:1px solid #ababab;border-radius:15px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.4s;}
input:checked+.switch-slider:before{left:calc(100% - 13px);}
.switch-slider:before{background-color:#4c7fff;border-radius:50%;bottom:1px;content:"";height:11px;left:2px;position:absolute;transition:.4s;width:11px;}
.system-item{display:flex;justify-content:center;align-items:center;gap:10px;color:#4f4f4f;font-size:17px;}
.system-item.activated{color:#4c7fff;}



@media (max-width:1200px){
    .container {
        padding: 0 15px;
        box-sizing: border-box;
    }
}
@media (max-width:992px){

}
@media (max-width:768px){

}
@media (max-width:576px){
    .digiarty-timer {
        zoom: 0.7;
    }
}


/* `````````````````````````````````````````````````````````````````````````````````````` */
.part-calendar {
    padding-top: 50px;
    background: url("../images/adventscalender/bg-calendar-christmas.jpg") no-repeat center;
    background-size: 100% auto;
}
.calendar-share {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-bottom: 30px;
    gap: 10px;
}
.calendar-share p {
    font-size: 19px;
    font-weight: 400;
    line-height: 1.4;
}
.calendar-share-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}
.calendar-share-wrapper a {
    transform: translateY(0);
    transition: all 0.3s ease-in-out;
}
.calendar-share-wrapper a:hover {
    transform: translateY(-10px);
}

.calendar {
    position: relative;
    background-color: #fbf3d0;
    border-radius: 80px;
    --thickness: 15px;     /* 边框厚度 */
    --angle: -45deg;
    --stripe: 16px;        /* 单色条纹宽度 */
    --red: #ff552d;
    --white: #fff;
    padding: calc(var(--thickness) + 0px); /* 内边距保证内容不被伪元素覆盖 */
    overflow: visible;
}
/* 伪元素画条纹（放在边框外层） */
.calendar::before{
  content: "";
  position: absolute;
  inset: 0;                       /* 覆盖整个元素 */
  border-radius: inherit;
  padding: var(--thickness);      /* 伪元素内缩，变成“边框”厚度 */
  background: repeating-linear-gradient(
    var(--angle),
    var(--red) 0 var(--stripe),
    var(--white) var(--stripe) calc(var(--stripe) * 2)
  );
  -webkit-mask:
    linear-gradient(#000,#000) content-box, 
    linear-gradient(#000,#000); /* 兼容旧版浏览器 */
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  box-sizing: border-box;
  /* 可选动效：移动条纹 */
  animation: stripes 4s linear infinite;
}
/* 动画：沿着条纹方向移动背景 */
@keyframes stripes{
  from{ background-position: 0 0; }
  to{ background-position: 100% 100%; }
}

.calendar-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    border-radius:66px;
    overflow: hidden;
}

.calendar .card {
    width: 290px;
    height: 330px;
    perspective: 1000px;
    position: relative;
    color: #656565;
    font-size: 17px;
    line-height: 1.2;
}
.card-container {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}



.card.expired .card-container {
    transform: rotateY(0);
}
.card.expired .card-button {
    display: none;
}
.card.expired .expired-button {
    display: block;
}
.card.turnover .card-container {
    transform: rotateY(180deg);
}

.card.locked .card-container {
    transform: rotateY(0deg);
}

.card.turnover .card-container {
    transform: rotateY(180deg);
}

.card-front,
.card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 15px;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
    overflow: hidden;
}

.card-front {
    background: #fffdf5;
    z-index: 2;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-direction: column;
    gap: 5px;
    padding: 18px 0;
}

.card-back {
    background: #32b972;
    transform: rotateY(180deg);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 30px;
    color: #fff;
    position: relative;
}
.card-back::before {
    content: '';
    display: block;
    width: 38px;
    height: 38px;
    background: url("../images/adventscalender/bt-arrow.svg") no-repeat center;
    transform: rotate(90deg);
    background-size: cover;
    position: absolute;
    left: 15px;
    top: 10px;
    cursor: pointer;
}

.box-card {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    margin-bottom: 10px;
}
.card-name {
    color: #1c1c1c;
    font-size: 17px;
    white-space: nowrap;
}
.card-name em {
    color: #f02900;
    font-style: normal;
}
.card-name del {
    color: #f02900;
    font-style: normal;
}
.card-name a {
    color: inherit;
    text-decoration: none;
}
.card-name a:hover {
    text-decoration: underline;
    color: #2691fc;
}
.card-desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* 设置为 2 行 */
    line-clamp: 2; /* 设置为 2 行 */
    line-height: 1.2; /* 行高 */
    max-height: 2.4; /* 2 行高度 = 行高 * 行数 */
    overflow: hidden;
    padding:  0 20px;
}
.card-button button {
    outline: none;
    border: none;
    border-radius: 30px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 9px 43px;
    background: linear-gradient(90deg, #ff9f1b, #ff832b);
    font-size: 19px;
    cursor: pointer;
}
.expired-button {
    display: none;
}
.expired-button button {
    outline: none;
    border: none;
    border-radius: 30px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 9px 43px;
     background: linear-gradient(90deg, #ff9f1b, #ff832b);
    font-size: 19px;
    cursor: not-allowed;
    filter: grayscale(100);
}
.card-back-title {
    color: #feffc2;
    font-size: 25px;
}
.card-email-submit {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 10px;
}
.card-email-submit input {
    background-color: #fff;
    height: 33px;
    border: none;
    outline: none;
    padding: 0 5px;
    color: #000;
    width: 100%;
    border-radius: 5px;
    box-sizing: border-box;
}
.card-email-submit button {
    outline: none;
    border: none;
    background-color: #ffef8f;
    color: #32b972;
    height: 33px;
    padding: 0 15px;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
    border-radius: 30px;
}
.card-email-submit a {
    outline: none;
    border: none;
    background-color: #ffef8f;
    color: #32b972;
    height: 33px;
    line-height: 33px;
    padding: 0 15px;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
    border-radius: 30px;
    text-decoration: none;
}
.card-back-desc {
    line-height: 1.4;
}
.locked-mask {
    position: absolute;
    z-index: 3;
    background: rgba(0, 0, 0, 0.6);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
}
.card.locked .locked-mask {
    display: block;
}
.mask-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    box-sizing: border-box;
    background-color: #ffb24e;
    padding: 20px;
    color: #ffffff;
}

.seccess-over {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    left: 0;
    top: 0;
    display: none;
}
.seccess-wrap {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 15px;
}

@media (max-width:1400px){
    .calendar-container {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(8, 1fr);
    }
    .calendar .card {
        width: 100%;
    }
}
@media (max-width:992px){
   
}
@media (max-width:768px){
    .calendar-container {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(12, 1fr);
    }
}
@media (max-width:576px){
    .calendar-container {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(24, 1fr);
    }
}

@media (max-width: 1400px) {

}
@media (max-width: 1200px) {

}
@media (max-width: 992px) {

}
@media (max-width: 768px) {

}
@media (max-width: 576px) {

}

/* ``````````````````````````````````````````````````````````````````````````` */
.part-banner {
    background: url("../images/adventscalender/bg-banner-christmas.jpg") no-repeat center top;
    background-size: 100% auto;
    text-align: center;
    padding: 80px 0;
}

.layer-buttons-flex {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    position: relative;
    z-index: 3;
}
.layer-buttons-item {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 5px;
}
.layer-buttons-down a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    background-color: #36c97b;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
    gap: 15px;
    font-size: 19px;
    padding: 0 20px;
    min-width: 250px;
    box-sizing: border-box;
}
.layer-buttons-buy a {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    height: 50px;
    background-color: #ffab1b;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
    gap: 15px;
    font-size: 19px;
    padding: 0 20px;
    min-width: 250px;
    box-sizing: border-box;
}
.layer-buttons-expand a {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    height: 50px;
    border: 1px solid #5658ff;
    color: #5658ff;
    border-radius: 5px;
    text-decoration: none;
    gap: 15px;
    font-size: 19px;
    padding: 0 20px;
    min-width: 250px;
    box-sizing: border-box;
}
.layer-buy-price {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-size: 15px;
    line-height: 1;
}
.layer-buy-price span {
    color: #e5241f;
}
.layer-buy-price del {
    color: #271f35;
}
.layer-buttons-more {
    color: #666666;
    font-size: 15px;
    text-align: center;
}
.layer-buttons-more a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    color: inherit;
    text-decoration: none;
}
.layer-buttons-more a:hover {
    text-decoration: underline;
}

.title-h1 {
    font-size: 41px;
    font-weight: 700;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 10px;
}
.title-h1 span {
    color: #ffc13b;
}
.title-suhead {
    font-size: 21px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 30px;
}
.main-suhead {
    font-size: 19px;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 30px;
    text-align: center;
}
.title-h2 {
    font-size: 33px;
    font-weight: 700;
    color: #000000;
    line-height: 1.2;
    margin-bottom: 10px;
    text-align: center;
}
.title-h2 a {
    text-decoration: none;
    color: inherit;
}
.title-h2 a:hover {
    text-decoration: underline;
    color: #2691fc;
}
.title-h3 {
    font-size: 31px;
    font-weight: 700;
    color: #000000;
    line-height: 1.2;
    margin-bottom: 10px;
}


.inner-videos-wrap {
    position: relative;
}

.inner-videos li {
    display: none;
}

.inner-videos li.active {
    display: block;
}

.inner-videos .video-wrap {
    width: 528px;
    position: relative;
}

.inner-videos .video-wrap::before {
    content: "";
    display: block;
    padding-top: 56.25%;
}

.inner-videos .video-wrap video {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 10px;
}

.inner-videos p {
    font-size: 19px;
    color: #000;
    line-height: 1;
    text-align: center;
    padding: 10px 0 0;
    margin-bottom: 15px;
}

.inner-dots {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.inner-dots li {
    width: 40px;
    height: 8px;
    cursor: pointer;
    background-color: #e0e0e0;
}

.inner-dots li.active {
    background-color: #33c973;
}


.banner-tab {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 40px;
}
.banner-tab-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    color: #5b7567;
    border-radius: 30px;
}
.banner-tab-item {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 45px;
    padding: 0 20px;
    border-radius: 30px;
    font-size: 21px;
    min-width: 250px;
    position: relative;
    text-decoration: none;
    color: inherit;
}
.banner-tab-item.active {
    background-color: #ffae00;
    color: #ffffff;
}
.banner-tab-item img {
    position: absolute;
    left: -3px;
    bottom: -2px;
}

.banner-wrapper {
    position: relative;
    margin-bottom: 50px;
}
.banner-container {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.banner-content-wrapper {
    padding: 30px 45px;
    background-color: #fff;
}


.banner-content-flex {
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 40px;
    padding-top: 20px;
}
.content-right {
    flex: 1;
    text-align: left;
}
.content-right p {
    font-size: 17px;
    line-height: 1.4;
}
.content-right-desc {
    font-size: 19px;
}
.content-right-list {
    padding: 30px 0;
}
.content-right-list li {
    position: relative;
    padding: 3px 0 3px 20px;
}
.content-right-list li::before {
    content: '';
    display: block;
    width: 3px;
    height: 10px;
    border: 2px solid #37ba43;
    transform: rotate(45deg);
    border-top-color: transparent;
    border-left-color: transparent;
    position: absolute;
    left: 0;
    top: 6px;
}
.content-right-btns {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
}
.button-base {
    width: 270px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    border-radius: 5px;
    color: #fff;
    text-decoration: none;
    margin: 0 auto;
    background-color: #36cd79;
    font-size: 19px;
}
.button-fold span {
    color: #fff667;
}
.button-buy {
    background-color: #fca033;
    font-size: 23px;
}
.button-buy-type {
    font-size: 15px;
    line-height: 1;
    color: #37240e;
    display: none;
}
.button-buy-price {
    font-size: 15px;
    line-height: 1;
    color: #fff;
}

@media (max-width:1200px){

}
@media (max-width:992px){
    .banner-content-flex {
        flex-wrap: wrap;
    }
    .content-right-btns {
        justify-content: center;
        flex-wrap: wrap;
    }
    .part-banner {
        padding: 30px 0;
    }
    .banner-wrapper {
        margin-bottom: 20px;
    }
}
@media (max-width:768px){
    .title-h1 {
        font-size: 1.6875rem;
    }
    .title-h2 {
        font-size: 1.4375rem;
    }
    .title-suhead {
        font-size: 1.1875rem;
    }
    .main-suhead {
        font-size: 1.0625rem;
    }
}
@media (max-width:576px){
    .banner-tab-wrap {
        flex-wrap: wrap;
    }
    .inner-videos .video-wrap {
        width: 100%;
        max-width: 528px;
    }
}

/* ``````````````````````````````````````````````````````````````````````````` */
.banner-content-fold {
    margin-bottom: 50px;
    padding-top: 50px;
    padding-right: 70px;
    padding-left: 70px;
}
.banner-fold-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    position: relative;
}
.banner-fold-left {
    width: 45%;
    background-color: #ffffff;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.banner-fold-right {
    width: 55%;
    background-color: #ffffff;
    border-radius: 10px;
    overflow: hidden;
    border: 3px solid #ffbe4f;
}
.banner-fold-mid {
    position: absolute;
    left: 45%;
    top: 50px;
    transform: translateX(-50%);
    z-index: 10;
}

.fold-desc {
    font-size: 17px;
    line-height: 1.4;
    color: #000000;
    margin-bottom: 10px;
    min-height: 48px;
}
.fold-content {
    background-color: #fff;
    padding: 40px 50px 15px;
}
.rights-content {
    background-color: #fff8f2;
    padding: 20px 50px;
    display: flex;
    justify-content: center;
    text-align: left;
}
.rights-item {
    margin-bottom: 20px;
}
.rights-name {
    font-size: 17px;
    margin-bottom: 5px;
    font-weight: 700;
}
.rights-list li {
    position: relative;
    padding: 3px 0 3px 25px;
}
.big .rights-list li {
    padding: 12px 0 12px 25px;
}
.rights-list li.rights-true::before {
    content: '';
    display: block;
    background: url("../images/adventscalender/i-yes.png") no-repeat center;
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 8px;
}
.rights-list li.rights-false::before {
    content: '';
    display: block;
    background: url("../images/adventscalender/i-no.png") no-repeat center;
    width: 13px;
    height: 2px;
    position: absolute;
    left: 1px;
    top: 15px;
}
.rights-list li.rights-gift::before {
    content: '';
    display: block;
    background: url("../images/adventscalender/i-gift.png") no-repeat center;
    width: 19px;
    height: 19px;
    position: absolute;
    left: -1px;
    top: 5px;
}
.big .rights-list li.rights-true::before {
    left: 0;
    top: 16px;
}
.big .rights-list li.rights-false::before {
    left: 1px;
    top: 22px;
}
.big .rights-list li.rights-gift::before {
    left: -1px;
    top: 12px;
}

.rights-gift a {
    font-size: 15px;
    color: #000000;
    font-weight: 700;
    text-decoration: none;
}
.rights-gift del  {
    font-size: 15px;
    color: #444;
    margin-left: 10px;
    font-weight: 400;
}

.fold-email-submit {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #c3c3c3;
    margin-bottom: 10px;
}
.fold-email-submit input {
    flex: 1;
    background-color: #fff;
    height: 48px;
    border: none;
    outline: none;
    padding: 0 10px;
    font-size: 15px;
    color: #000;
}
.fold-email-submit button {
    outline: none;
    border: none;
    background-color: #92cf3f;
    color: #fff;
    height: 48px;
    padding: 0 25px;
    cursor: pointer;
    font-size: 19px;
}
.hide-btn {
    height: 1px;
    background-image: linear-gradient(90deg, transparent, #d8dcd8, transparent);
}
.hide-btn span {
    display: inline-block;
    color: #ffffff;
    background: linear-gradient(180deg, #3a6ad7, #d6e1ff);
    width: 120px;
    height: 35px;
    line-height: 35px;
    font-size: 17px;
    text-align: center;
    border-radius: 0 0 10px 10px;
    cursor: pointer;
}



.buy-payment-service {padding-top: 18px;display: flex;justify-content: center;align-items: flex-end;gap: 120px;flex-wrap: wrap;}
.buy-service {display: flex;flex-wrap: wrap;}
.buy-service>li {min-width: 200px;display: flex;justify-content: center;align-items: center;gap: 15px;font-size: 14px;color: #96a0bc;line-height: 1.3;text-align: center;position: relative;}
.buy-service>li::before {content: "";width: 51px;height: 41px;background: url(../images/adventscalender/service-icons-christmas.png) no-repeat left center;}
.buy-service>li+li::after {content: "";width: 1px;height: 33px;background-color: #96a0bc;position: absolute;left: 0;top: 50%;margin-top: -16px;}
.buy-service>li:nth-child(2)::before {width: 39px;background-position-x: -207px;}
.buy-service>li:nth-child(3)::before {width: 38px;background-position-x: -409px;}


@media (max-width:1200px){
    .fold-content {padding: 40px 40px 15px;}
    .banner-content-fold {
        padding-right: 0;
        padding-left: 0;
    }
}
@media (max-width:992px){
    .buy-payment-service {
        gap: 30px;
    }
    .banner-fold-flex  {
        flex-wrap: wrap;
    }
    .banner-fold-left {
        flex: none;
        width: 100%;
    }
    .banner-fold-right {
        flex: none;
        width: 100%;
    }
    .banner-fold-mid {
        top: 0;
        left: 0;
        transform: translate(0, 0);
        position: relative;
        text-align: center;
        margin: 0 auto;
    }
}
@media (max-width:768px){
    .buy-service {
        justify-content: center;
        gap: 10px;
    }
    .fold-desc {
        font-size: 15px;
    }
}
@media (max-width:576px){
    .fold-content {
        padding: 40px 10px 15px;
    }
    .fold-email-submit button {
        font-size: 19px;
    }
}

/* ````````````````````````````````````````````````````````````````````````````` */
.ai-face-features{padding: 70px 0 20px;}



/* ````````````````````````````````````````````````````````````````````````````` */
.faq{padding:50px 0;}
.slide-container {padding: 10px 0 0;}
.slide-container .qes_one{border-bottom:1px solid #e6e6e6;padding:18px 0 8px;}
.slide-container .t{font-size:18px;line-height:20px;cursor:pointer;padding-bottom:10px;position:relative;padding-right:25px;}
.slide-container .t::before{content:"";width:17px;height:3px;background-color:#ffb069;position:absolute;top:8px;right:0;}
.slide-container .t::after{content:"";width:3px;height:17px;background-color:#ffb069;position:absolute;top:1px;right:7px;}
.slide-container .t.focus::after{display:none;}
.slide-container .qes_ans{color:#737480;display:none;}
.slide-container a{color:#2691fc;}


@media (max-width:1200px){

}
@media (max-width:992px){
    .ai-face-features .features{flex-wrap: wrap;justify-content: space-evenly;gap: 10px;}
}
@media (max-width:768px){

}
@media (max-width:576px){
    
}


.hide-share{text-align:left;margin-top:35px;}
.hide-share-title {margin-bottom: 10px;color: #000;font-size: 17px;}
.m01-share-a{display:inline-block;color:#000;padding:0 4px;text-decoration:none;text-align: center;}
.m01-share-a::before{content:'';display:block;margin:0 auto;height:30px;width:30px;background:url(https://www.aiarty.com/images/event/matting-giveaway/m01-share-icons.svg) no-repeat center top/100% auto;}
.m01-share-a-1:not([href])::before{background-position-y:-162px;}
.m01-share-a-2::before{background-position-y:-32px;}
.m01-share-a-3::before{background-position-y:-65px;}
.m01-share-a-4::before{background-position-y:-97px;}
.m01-share-a-5::before{background-position:4px -129px;}
.m01-share-a-1 span:last-of-type,.m01-share-a-1:not([href]) span:first-of-type{display:none;}
.m01-share-a-1:not([href]) span:last-of-type{display:initial;}

.mobile-flex-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 15px;
}


.slide-bar{position: fixed;display: none; width: 215px;right: 2%;top: 50%;transform: rotateY(-50%); padding: 40px 0 0;}
.slide-bar.active{display: block;}
.slide-bar .link-box a{font-size: 19px;text-decoration: none;cursor: pointer;color: inherit;border: 2px solid #000;border-radius: 30px;display: inline-block;width: 210px;text-align: center;margin-top: 10px;height: 55px;display: flex;justify-content: center;align-items: center;white-space: nowrap;}
.slide-bar .link-box a:hover{background: #ffae00;color: #ffffff;}


.giveaway-version-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
}

.giveaway-version-mask p {
    color: #fff;
    font-size: 21px;
    line-height: 26px;
    text-align: center;
}

.giveaway-version-mask a {
    text-decoration: underline;
    color: #538ffe;
}

.giveaway-version-mask a:hover {
    color: #538ffe;
}



#stack-swiper {overflow-x: hidden;}
#stack-swiper .swiper-wrapper .swiper-slide { width: auto; height: 270px !important;}
.stack-swiper-module { display: flex; align-items: center;}
.stack-swiper-module :is(.swiper-button-prev, .swiper-button-next) { width: 3rem; height: 3rem; background: none; margin: 0; }
.stack-swiper-module :is(.swiper-button-prev, .swiper-button-next) svg { width: 3rem; height: 3rem; }
.stack-swiper-module :is(.swiper-button-prev, .swiper-button-next) path:nth-child(1) { opacity: 0.8; }
.stack-swiper-module :is(.swiper-button-prev, .swiper-button-next):hover path:nth-child(1) { fill: #565656; }
.mian01-feature .icons-feature .specialz::after {display: none !important;}
.mian01-feature .icons-feature {margin-bottom: 30px !important;}
.stack-desc {position: absolute;top: 15px;left: 15px;z-index: 1;font-size: 17px;line-height: 1.4;color: #ffffff;}
.stack-desc::before {content: '';display: inline-block;border: 5px solid transparent;border-left-color: #ffffff;border-left-width: 8px;}
#stack-swiper .swiper-wrapper .swiper-slide a:hover .stack-desc {text-decoration: underline;}
.main01 {padding-bottom: 10px;}
@media (max-width: 455px) {#stack-swiper .swiper-wrapper .swiper-slide { width: 100% !important; height: auto !important; max-width: 455px !important;}}