

img {
    margin: 0;
    border: 0;
    max-width: 100%;
    height: auto;
}
.swiper-pagination {bottom: 0 !important;}
.swiper-pagination-bullet {width: 8px;height: 8px;margin: 0 4px !important;opacity: .2;}
.swiper-pagination-bullet-active { background-color: #55E5C5;opacity: 1;}
/* `````````````````````````````````````````````````````````````` */
.part-banner {
    background: url("../images/aiarty-anime-illustrations/bg-banner.jpg") no-repeat center #0d92c6;
    background-size: cover;
    color: #fff;
    padding: 70px 0;
}
.banner-content-flex {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 100px;
}
.banner-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.title-h1 {
    margin-bottom: 50px;
    font-size: 0px;
}
.banner-suhead {
    font-size: 23px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 10px;
}
.banner-desc {
    font-size: 17px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 10px;
}
.banner-time-name {
    font-size: 19px;
    font-weight: 700;
    color: #ffcc00;
    line-height: 1.4;
    margin-bottom: 10px;
}
.banner-time {
    font-size: 27px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.4;
    background: url("../images/aiarty-anime-illustrations/bg-banner-time.png") no-repeat center;
    width: 530px;
    height: 85px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 17px;
    padding-left: 20px;
    text-shadow:
    2px 0 #0036ff,
    -2px 0 #0036ff,
    0 2px #0036ff,
    0 -2px #0036ff,
    2px 2px #0036ff,
    -2px -2px #0036ff,
    2px -2px #0036ff,
    -2px 2px #0036ff;
}
.banner-tabs-list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}
.banner-tabs-item {
    border: 2px solid transparent;
    border-radius: 10px;
    font-size: 0;
}
.banner-tabs-item:hover {
    border: 2px solid #ff1f00;
}

@media (max-width:1400px){

}
@media (max-width:1200px){
    .banner-tabs-list {
        flex-wrap: wrap;
    }
}
@media (max-width:992px){
    .banner-content-flex {
        justify-content: center;
    }
}
@media (max-width:768px){

}
@media (max-width:576px){
    .banner-time {
        max-width: 530px;
        width: 100%;
        font-size: 21px;
    }
}

/* `````````````````````````````````````````````````````````````` */
.banner-shadow-title {
    font-size: 43px;
    color: #fff;
    line-height: 1.2;
    position: relative;
    z-index: 0;
    font-weight: 700;
    margin: 30px 0;
    align-self: flex-end;
}
.banner-shadow-title::after {
    content: attr(content);
    position: absolute;
    -webkit-text-stroke: .22em #5d1aa9 !important;
    left: 0;
    right: 0;
    z-index: -1;
    top: 0;
}
.banner-shadow-title:first-of-type img{position:absolute; margin-left:-75px;}


@media (max-width:1400px){

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

}
@media (max-width:992px){
    .banner-shadow-title {
        font-size: 27px;
    }
}
@media (max-width:768px){
    .banner-shadow-title {
        font-size: 23px;
    }
}
@media (max-width:576px){
    .banner-shadow-title {
        font-size: 19px;
    }
}

/* `````````````````````````````````````````````````````````````` */
.part-toogle {
    padding-bottom: 60px;
    text-align: center;
}
.part-toogle-range {
    background: linear-gradient(to right, #dcdcff 50%, white 50%);
    padding: 70px 0 0;
}
.part-toogle-range.reverse {
    background: linear-gradient(to right, white 50%, #ffe7c3 50%);
    padding: 70px 0 0;
}
.toogle-box {
    background-color: #c0d2ff;
    border-radius: 20px;
    position: relative;
}
.toogle-box.reverse {
    background-color: #ffd698;
}
.toogle-content {
    width: 31vw;
    position: absolute;
    left: 4.5%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: left;
    color: #fff;
    z-index: 10;
}
.toogle-content.reverse {
    right: 4.5%;
    left: auto;
    transform: translate(50%, -50%);
}
.toogle-uppercase-big {
    text-transform: uppercase;
    font-size: 129px;
    line-height: 1;
    font-weight: 700;
}
.toogle-uppercase {
    text-transform: uppercase;
    font-size: 65px;
    line-height: 1;
    font-weight: 700;
}
.toogle-desc {
    font-size: 17px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 15px;
    margin-top: 15px;
}
.toogle-suhead {
    font-size: 17px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.4;
}

.banner-anim {background-color: #000;border-radius: 15px;overflow: hidden;}
.banner-anim.reverse {
    left: 10%;
    right: auto;
}
.ai-matting-bg-contenter{position:relative;overflow: hidden;}
.ai-matting-bg-contenter .ai-matting-bg-box >img{width: 100%;height: auto;}
.ai-matting-bg-box .pic-ing{position: absolute;width:0;height: 100%;opacity: 0;left: 0;top: 0;background-color: #000;}
.ai-matting-bg-box .normal-ing {position: relative;}
.ai-matting-bg-box .normal-ing>img {display: block;}
.ai-matting-bg-box .pic-ing img{max-width: 100%;height: 100%;object-fit: cover;object-position: 0;}
.ai-matting-bg-box .pic-ing::after{content:"";position: absolute;right: 0;width: 2px;height: 100%;background:url(../../images/aiarty-image-matting/index/banner-line.png) no-repeat;top: 0;}
.ai-matting-bg-box.active .ai2{animation: analysis 2s 2s forwards;}
.ai-matting-bg-box.active .ai3{animation: analysis 2s 4s forwards;}
.ai-matting-bg-box.active .ai4{animation: analysis 2s 6s forwards;}
@keyframes analysis{ 0%{width: 0;opacity: 1;} 100%{width: 100%;opacity: 1;} }

.m04-get-code-x{font-size:19px; font-weight:700;padding: 30px 0;cursor: pointer;}
.step-container .m04-get-code-x {padding-top: 20px;}
.step-container .m04-get-code-x b {margin: 5px 0 0;}
.m04-get-code{font-size:19px;border:2px dashed #D3D3D3;font-weight:700;font-family:Arial;padding:9px 3.5% 7px;display:inline-block;margin-left:5px;}
.m04-get-code img {
    filter: invert(100%) brightness(0%);
    margin-left: 10px;
    vertical-align: text-bottom;
}
.m04-get-code img.w {
    filter: none;
}

.toogle-button-wrapper {
    max-width: 838px;
    margin: 0 auto;
}
.toogle-button {
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: .625rem;
    height: 3.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 30px;
    position: relative;
    color: #fff;
    overflow: hidden;
}

.toogle-button:before {
    content: "";
    top: 0;
    left: 0;
    position: absolute;
    bottom: 0;
    right: 0;
    background: hsla(0, 0%, 100%, .4);
    filter: blur(10px);
    border-radius: 8px;
    opacity: 0;
    z-index: 1;
    transition: opacity .3s;
}
.toogle-button:after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    border-radius: calc(.625rem - 2px);
    background: linear-gradient(149.29deg, #0190ff 2.96%, #8648ff 60.37%, #eb11ff 93.98%);
}

.toogle-button-scroll {
    display: inline-block;
    animation: page_arrow-scroll__brp0_ 2s linear infinite;
    animation-delay: 1s;
    position: absolute;
    left: 0;
    color:transparent;
    z-index: 1 !important;
}

@keyframes page_arrow-scroll__brp0_ {
    0% {
        transform: translateX(0)
    }

    to {
        transform: translateX(300%)
    }
}

.nologin_tip {
    position: absolute;
    top: 2px;
    right: 2px;
    color: #fff;
    font-size: 12px;
    line-height: 16px;
    padding: 6px 17px;
    z-index: 2;
    background: linear-gradient(90deg, #2b62ff, #8911e2);
    border-radius: 0 .625rem 0 .625rem;
}

@media (max-width:1600px){
    .toogle-content.reverse {
        right: 0;
        left: auto;
        position: relative;
        width: 100%;
        left: 0;
        top: 0;
        transform: translate(0, 0);
        text-align: center;
        padding: 30px 15px;
    }
}
@media (max-width:1200px){
    .toogle-content {
        position: relative;
        width: 100%;
        left: 0;
        top: 0;
        transform: translate(0, 0);
        text-align: center;
        padding: 30px 15px;
    }
    .toogle-uppercase-big {
        font-size: 35px;
    }
    .toogle-uppercase {
        font-size: 27px;
    }
}
@media (max-width:992px){

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

}
@media (max-width:576px){
    .toogle-button {
        font-size: 17px;
    }
}

/* `````````````````````````````````````````````````````````````` */
.part-upscale {
    text-align: center;
    padding: 70px 0;
    background-color: #000000;
    color: #fff;
}
.video-inner {flex-shrink: 0;width: 1800px;position: relative;margin: 0 auto;}
.video-inner::before {content: "";display: block;padding-bottom: 53.25%;}
.video-inner::after {content: "";width: 100%;height: 101%;background: linear-gradient(to right, #000, transparent 12%, transparent 88%, #000), linear-gradient(#000, transparent 15%, transparent 85%, #000);position: absolute;top: 0;left: 0;}
.video-inner>video {width: 100%;height: 100%;position: absolute;top: 0;left: 0;}
.upscale-tips{
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99;
    width: 100%;
}
.upscale-tips p {
    flex: 1;
    white-space: nowrap;
    text-align: center;
    font-size: 25px;
}

@media (max-width:1800px){
    .video-inner {
        width: 100%;
        max-width: 1800px;
    }
}
@media (max-width:1400px){

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

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

}
@media (max-width:768px){
    .upscale-tips p {
        font-size: 19px;
    }
}
@media (max-width:576px){
    .upscale-tips p {
        font-size: 17px;
    }
}

/* `````````````````````````````````````````````````````````````` */

.ai-rt-pkgs-sub{display:grid; grid-template-rows:repeat(3, auto);margin-bottom: 30px;}
.ai-rt-pkgs-sub::before{content:''; grid-area:2 / 1 / 4; background-color:#fff; border:6px solid #ff9d30; border-radius:20px;}
.ai-rt-pkgs-title-x{grid-area:1 / 1 / 3;}
.ai-rt-pkgs-title{display:inline-block; font-size:29px; color:#fff; background-color:#fc7817; padding:12px 4%; border-radius:100vw; font-weight:700; margin:0 30px;}
.ai-rt-pkgs-con{grid-area:3 / 1; display:flex; padding:3%; justify-content:space-between; align-items:center; min-width:0;}
.ai-rt-pkgs-imgs-x, .ai-rt-pkgs-info{margin:0 10px;}
.ai-rt-pkgs-imgs-x{width:600px; min-width:0;}
.ai-rt-pkgs-imgs{margin-bottom:20px; text-align:center;}
.ai-rt-pkgs-imgs>li {display: none;}
.ai-rt-pkgs-imgs>li img{vertical-align:middle; border-radius:20px; height:auto;width: 100%;}
.ai-rt-pkgs-imgs>li.active {display: block;}
.ai-rt-pkgs-video{width:100%; display:block; border-radius:20px; height:auto;}
.ai-rt-pt-wrap,.ai-rt-pt-icons {display: flex;justify-content: center;}
.ai-rt-pt-icons>li {width: 71px;height: 59px;border-radius: 4px;overflow: hidden;position: relative;cursor: pointer; margin:0 10px;}
.ai-rt-pt-icons>li::before {content: "";display: none;width: 100%;height: 100%;box-shadow: inset 0 0 0 2px #f87d34;border-radius: 4px;position: absolute;top: 0;left: 0;}
.ai-rt-pt-icons>li.active::before {display: block;}
.ai-rt-pt-arrow {width: 28px;height: 59px;cursor: pointer;overflow: hidden;}
.ai-rt-pt-arrow::before {content: "";display: block;width: 12px;height: 12px;border-left: 3px solid #000;border-bottom: 3px solid #000;transform: rotate(45deg);margin: 23px 0 0 9px;border-radius: 2px;}
.ai-rt-pt-arrow.right-arrow::before {margin-left: 3px;transform: rotate(-135deg);}
.ai-rt-pkgs-info{min-width:500px;}
.ai-rt-pkin-con-x + .ai-rt-pkin-con-x{margin-top:6px;}
.ai-rt-pkin-con-title{font-size:27px; font-weight:700; display:flex; align-items:center;color: #000;}
.ai-rt-pkin-con-title img{padding-right:10px;}
.ai-rt-pkin-con-intros{margin:23px 0 17px;}
.ai-rt-pkin-con-intros > li:not(:last-of-type)::after{content:'+'; font-size:35px; line-height:1; font-family:Arial; margin:-3px 0 -3px 13px; display:block; text-align:left;color: #000;}
.ai-rt-pkin-con-intro{display:flex; align-items:center; position:relative;}
.ai-rt-pkin-con-intro > img{object-fit:contain;}
.ai-rt-pc-product-info{margin:0 10px; flex:1; text-align:left;}
.ai-rt-pc-product-info span{font-size:19px; font-weight:700; padding-right:5px;color: #000;}
.ai-rt-pc-product-info > p{margin-top:3px; font-size:15px; color:#1a3f80; line-height:1.25;}
.ai-rt-pc-product-price{display:flex; flex-flow:column; align-items:flex-end; justify-content:space-between; align-self:stretch; font-size:19px; color:#e55c00; padding:5px 0;}
.ai-rt-pc-product-price del{font-size:13px; color:#636363;}
.ai-rt-pkgs-tip{font-size:13px; color:#707070;}
.ai-rt-product-tip{font-size:21px; color:#7a7a7a;}
.ai-rt-ppi-hint-x{display:inline-block;}
.ai-rt-ppi-hint-icon{position:relative;}
.ai-rt-ppi-hint-icon::after{content:''; width:10px; height:10px; background-color:#eee; position:absolute; left:50%; bottom:100%; transform:translate(-50%) rotate(45deg); display:none; margin-bottom:3px;}
.ai-rt-ppi-hint-icon:hover::after{display:block;}
.ai-rt-ppi-hint-icon:hover + .ai-rt-ppi-hint{display:inline-block;}
.ai-rt-ppi-hint{position:absolute; background-color:#eee; padding:5px; border-radius:5px; font-size:13px; line-height:1.3; transform:translateY(-100%); margin:-6px 0 0 -27px; display:none;}
@media(max-width:1200px){
	.ai-rt-pkgs-info{min-width:auto; flex:auto;}
	.ai-rt-pt-wrap{flex-flow:wrap;}
	.ai-rt-pt-icons{order:1; width:100%;}
}
@media(max-width:767px){
	.ai-rt-pkgs-con{flex-flow:wrap; justify-content:center; gap:20px;}
	.ai-rt-pkgs-imgs-x, .ai-rt-pkgs-info{margin:0;}
}
@media(max-width:479px){
	.ai-rt-pt-icons{flex-flow:wrap;}
}

.ai-rt-psb-price{display:flex; align-items:flex-end; justify-content:center;}
.ai-rt-psbp-original{color:#fff; font-weight:700; background:url(../images/aiarty-rentio-tokka/price-bg.png) no-repeat center / 100%; width:110px; height:107px; display:flex; flex-flow:column; justify-content:center; box-sizing:border-box; padding:44px 0 17px;}
.ai-rt-psbp-del:first-child{font-size:73%; padding-bottom:2px;}
.ai-rt-psbp-off{font-size:46px; color:#fff; line-height:.75; background-color:#DC2F2F; border-radius:10px; padding:17px 10px; margin:0 8px 10px; position:relative;}
.ai-rt-psbp-off::after{content:''; border:10px solid transparent; border-top-color:#DC2F2F; position:absolute; left:0; right:0; width:0; top:100%; margin:0 auto;}
.ai-rt-psbpo-small{font-size:77%;}
.ai-rt-psbp-ta{color:#3f3f3f; display:block;}
.ai-rt-psbp-lt{font-size:18px; color:#dc2f2f; border:1px solid; border-radius:100vw; padding:2px 15px; display:inline-block; margin:3px 0 15px}
.ai-rt-psb-a{font-size:25px; font-weight:700; display:block; background:linear-gradient(to right, #FFA233, #FC7817) no-repeat; color:#fff; border-radius:100vw; padding:10px; margin:6px 0 12px;}
.ai-rt-psb-tip{font-size:16px;}
.ai-rt-psb-list-x{width:fit-content; width:-moz-fit-content; width:-webkit-fit-content; margin:32px auto 37px;}
.ai-rt-psb-list{font-size:18px; text-align:left; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='14' viewBox='0 0 18.88 14.13'%3E%3Cpath d='M.31 7.41a1.135 1.135 0 0 1 1.6 0l4.82 4.79a1.131 1.131 0 0 1-1.61 1.59L.31 9a1.105 1.105 0 0 1 0-1.59zM18.51.35a1.165 1.165 0 0 1 0 1.67L6.72 13.76a1.207 1.207 0 0 1-1.69 0 1.2 1.2 0 0 1 0-1.68L16.83.35a1.177 1.177 0 0 1 1.68 0z' fill='%2350c430'/%3E%3C/svg%3E") no-repeat 0 3px; padding-left:25px; margin:17px 0;}
.ai-rt-psb-safes{display:flex; justify-content:space-between; margin-top:15px;}
.ai-rt-psb-safe{margin:5px;}
.ai-rt-psbs-icon{object-fit:none;}
.ai-rt-psbs-icon0{object-position:0;}
.ai-rt-psbs-icon1{object-position:-36px;}
.ai-rt-psbs-icon2{object-position:-75px;}
.ai-rt-psbs-icon3{object-position:-110px;}
.ai-rt-psbs-title{font-size:13px; line-height:1.4;}

@media (max-width:1400px){

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

}
@media (max-width:992px){
    .ai-rt-pkin-con-title {
        font-size: 21px;
    }
    .ai-rt-pc-product-info span {
        font-size: 15px;
    }
}
@media (max-width:768px){

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

/* `````````````````````````````````````````````````````````````` */
.part-anniversary {
    text-align: center;
    background: url("../images/aiarty-anime-illustrations/bg-anniversary.jpg") no-repeat center top #6c37d3;
    padding: 70px 0;
    background-size: cover;
    color: #fff;
}

.anniversary-title {
    font-size: 59px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 10px;
}
.anniversary-desc {
    font-size: 25px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 10px;
}
.anniversary-discount {
    padding: 15px 0;
}
.digiarty-timer {font-size: 41px;color: #373970;line-height: 58px;text-align: center;margin: 10px 0 50px;}
.digiarty-timer li {display: inline-block; vertical-align: top; width: 68px; height: 68px; border: 1px solid #3a569e; font-size: 35px;line-height: 50px;text-align: center;border-radius: 4px; position: relative;background-color: transparent;color: #ffffff;}
.digiarty-timer li::after {width: 100%;font-size: 13px;text-align: center;line-height: 17px;position: absolute;bottom: 4px;left: 0;color: #556bcc;}
.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"}

@media (max-width:1400px){

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

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

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

}
@media (max-width:576px){
    
}
/* `````````````````````````````````````````````````````````````` */
.btn-secondary {
    color: #fff;
    background: linear-gradient(90deg, #028fff, #f713ff);
    border: none;
}
.btn {
    border-radius: 0.5rem;
    text-transform: capitalize;
}
.video-container {
    position: relative;
    overflow: hidden;
    background-size: cover;
    transform: scale(1);
}

.video-container video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.video-container::before {
    content: '';
    display: block;
    padding-top: var(--ratio, calc(9 / 16 * 100%));
}
.common-nav .nav {
    width: 100%;
    justify-content: space-between;
}

.common-nav .nav .nav-item {
    width: 32.8%;
    padding: 1rem .75rem;
    color: #ffffff;
    font-size: 1.125rem;
    background: #3240af;
    border-radius: .5rem;
}

.common-nav .nav .nav-item.active {
    color: #fff;
    background: #9346ff;
    font-weight: 700;
}

.part-resource {
    background-color: #0b2162;
    background-image: url('../images/aiarty-anime-illustrations/bg-resource.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center bottom;
    color: #fff;
    text-align: center;
    padding: 70px 0 30px;
}

.part-resource .nav .nav-item {
    background-color: #3240af;
    color: #ffffff;
}

.part-resource .swiper .swiper-wrapper {
    flex-wrap: wrap;
    justify-content: space-between;
}

.part-resource .swiper .swiper-wrapper .swiper-slide {
    width: 23.6%;
    margin-bottom: 3rem;
}

.part-resource .resource-item .item-btn {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 3;
    width: 100%;
    padding: .5rem 0 1rem 0;
    opacity: 0;
}

.part-resource .resource-item .item-btn .btn {
    margin: 0;
    font-size: 1.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.part-resource .resource-item .video-container {
    border-radius: .5rem;
    border: 2px solid transparent;
    --ratio: calc(440 / 330 * 100%);
    overflow: hidden;
}

.part-resource .resource-item video {
    z-index: 1;
    opacity: 1;
}

.part-resource .resource-item img,.part-resource .resource-item video {
    border-radius: .75rem;
    transition: all 0.2s ease-in-out;
}

.part-resource .resource-item img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    object-fit: cover;
}
.part-resource .resource-item h4 {
    font-size: 17px;
    font-weight: 700;
}
.part-resource .resource-item .opacity-8 {
    font-size: 15px;
}

.part-resource .veo-tag {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    background: linear-gradient(94.76deg, #3c72ff -23.92%, #f515ff 124.72%);
    border-radius: 0 0 16px 0;
    font-size: 1.125rem;
    line-height: 1.3;
    color: #fff;
    padding: 5px 12px;
    backdrop-filter: blur(10px);
    font-weight: 400;
}

@media (any-hover) {
    .common-nav .nav .nav-item:hover {font-weight: 700;}
    .part-resource .resource-item:hover .video-container {border-color: #9704ff;box-shadow: 0px 0px 19.3px 0px #3c4aff;}
    .part-resource .resource-item .video-container:hover img {opacity: 0;}
    .part-resource .resource-item .video-container:hover video {opacity: 1;}
    .part-resource .resource-item:hover .video-container .item-btn {opacity: 1;}
}

.resource-title {
    font-size: 23px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 15px;
}
.resource-desc {
    font-size: 15px;
    font-weight: 400;
    color: #ffffff;
    line-height: 1.4;
    margin-bottom: 15px;
}

@media (max-width: 1440px) {
    .part-resource .resource-item .item-btn .btn {
        font-size: 14px;
    }
}

@media (max-width: 1280px) {
    .part-resource .resource-item video {
        opacity: 1;
    }

    .part-resource .resource-item img {
        opacity: 0;
    }
}

@media (max-width: 992px) {
   
    .part-resource .swiper {
        overflow: hidden;
        position: relative;
    }

    .part-resource .swiper .swiper-pagination-bullet {
        background-color: #fff;
    }

    .part-resource .swiper .swiper-pagination-bullet-active {
        background-color: #55E5C5;
    }
}

@media (max-width: 576px) {
    .part-resource .resource-wrapper {
        padding: 2rem 0;
    }

    .part-resource .swiper .swiper-wrapper {
        flex-wrap: nowrap;
    }

}

/* ````````````````````````````````````````````````````````````````````` */
.user {padding: 120px 0 50px;background: #000 url(../images/aiarty-anime-illustrations/user-bg.jpg) no-repeat center bottom/100% auto;}
.user-top {width: 720px;}
.user-h2 {font-weight: 700;line-height: 1.4;padding-bottom: 16px;font-size: 35px;color: #fff;}
.user-p {color: #b2b2b2;line-height: 1.4;font-size: 17px;}
.user-cards {display: flex;justify-content: center;flex-wrap: wrap;gap: 28px;padding: 40px 0 14px;}
.user-card {width: 386px;height: 505px;display: flex;flex-direction: column;justify-content: space-between;box-sizing: border-box;padding: 24px 26px 28px;border: 1px solid rgba(255,255,255,0.2);border-radius: 15px;position: relative;overflow: hidden;}
.user-card::before {content: "";opacity: 0;transition: all 0.2s;position: absolute;bottom: 0;left: 0;width: 100%;height: 50%;background: linear-gradient(transparent, rgba(255,255,255,0.7));}
.user-card:hover::before {opacity: 1;}
.user-card.card1 {margin-top: 100px;background: url(../images/aiarty-anime-illustrations/user-card-bg1.png) no-repeat center bottom, linear-gradient(transparent, #cdcfe0) no-repeat center bottom/100% 40%;}
.user-card.card2 {background: url(../images/aiarty-anime-illustrations/user-card-bg2.png) no-repeat center bottom, linear-gradient(transparent, #cdcfe0) no-repeat center bottom/100% 40%;;}
.user-card.card3 {margin-top: -100px;background: url(../images/aiarty-anime-illustrations/user-card-bg3.png) no-repeat center bottom, linear-gradient(transparent, #cdcfe0) no-repeat center bottom/100% 30%;;}
.user-card-h3 {font-weight: 600;line-height: 1;font-size: 25px;color: #fff;}
.user-card-p {color: #000;line-height: 1.4;padding-left: 10px;opacity: 0;transform: translateY(28px);transition: all 0.2s;position: relative;}
.user-card:hover .user-card-p {opacity: 1;transform: translateY(0);}
@media (max-width: 1217px) {
    .user {padding-bottom: 70px;}
    .user-wrap {width: 96%;}
    .user-top {width: 100%;text-align: center;}
    .user-card {padding: 25px 15px;}
    .user-card.card1,.user-card.card3 {margin-top: 0;}
    .user-card::before {opacity: 1;}
    .user-card-p {padding-left: 0;opacity: 1;transform: none;}
}

@media (max-width:1400px){

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

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

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

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

/* ````````````````````````````````````````````````````````````````````` */
.cancel-popup-qa {
    background-color: #fff;
    border: 1px solid #038CE8;
    border-radius: 50%;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    width: 24px;
    height: 24px;
    z-index: 999;
}
.cancel-popup-qa::before {
    content: '';
    width: 15px;
    height: 1px;
    background-color: #038CE8;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
}
.cancel-popup-qa::after {
    content: '';
    width: 15px;
    height: 1px;
    background-color: #038CE8;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
}

.banner-section-popu {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    display: none;
}
.banner-section-popu .popu-mask {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .8);
    display: flex;
    justify-content: center;
    align-items: center;
}
.copy-successful {
    background-color: #ffffff;
    padding: 30px 50px 15px 30px;
    border-radius: 10px;
    position: relative;
    display: none;
}
.copy-successful p {
    padding-top: 10px;
    font-size: 17px;
    line-height: 1.4;
    font-weight: 700;
}
/* ``````````````````````````````````````````````````````````````````````````````````` */
.bottom-footer {background-color: #232323;}
.website-records { width:100%;padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;text-align:center;padding:24px 0;font-size:13px;line-height:1.5;color:#a6a6a6;}
@media (min-width:1280px){
    .website-records{max-width:1232px}
}
.website-records a{color:inherit;text-decoration:none;}
.website-records a:hover{color:#665eff;}
.footer2024-share-list { display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:15px;}
.footer2024-share-list a{transition:all 0.3s ease;}
.footer2024-share-list a:hover{opacity:.8 !important;/* transform:scale(1.1);*/
}

@media (max-width:1400px){

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

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

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

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