.product {
    padding-top: 333rem;
    overflow-x: hidden;
}
.product-box{
    width: 100%;
    background-color: #161831;
}
.product-content{
    background-color: #161831;
}
.nav-list-wrap {
     background: linear-gradient(to right,rgb(75,65,122) 0%, rgb(22,24,49) 33%);
    width: 100%;
    padding-left: 480rem;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 0;
}

.nav-list-wrap .nav-active::after {
    content: '';
    position: absolute;
    bottom: 22rem;
    left: 50%;
    transform: translateX(-50%);
    width: 50rem;
    height: 3rem;
    background-color: #fff;
    border-radius: 12rem;
}

.swiper-right-review-total a {
    color: #4CA9FF;
}

.swiper-right-title .title {
    font-size: var(--pc-biggest-title);
    font-weight: bold;
    color: #FFFFFF;
    white-space: nowrap;
}

.swiper-right-title .stitle {
    font-size: var(--pc-title);
    font-weight: 400;
    color: #FFFFFF;
}
.preview .swiper-slide {
    width: 135rem !important;
}

.container .swiper-slide {
    display: flex;
    /* align-items: center; */
}

.swiper-right-button {
    width: 472rem !important;
    background-color: #17AC64 !important;
    border-radius: 60rem !important;
}

.swiper-right-button2 {
    /*display: none;*/
    /*padding: 10rem 20rem;*/
    /*border-radius: 10rem;*/
    /*background-color: #269766;*/
    /*color: #fff;*/
    /*text-align: center;*/
    /*cursor: pointer;*/
    width: 472rem !important;
    background-color: #17AC64 !important;
    border-radius: 60rem !important;
}

.schedules-wrap {
    width: 100vw;
    height: 100%;
    background-color: #062031;
    color: #fff;
    padding: 148rem 76rem 200rem 0;
}

.schedules-wrap-title {
    font-size: 60rem;
    margin-bottom: 44rem;
    text-align: center;
}

.schedules-wrap-stitle {
    font-size: 30rem;
    margin-bottom: 44rem;
    text-align: center;
}

.schedules-wrap-bottom {
    display: grid;
    grid-template-columns: 30% 70%;
}

.schedules-wrap-bottom-item {
    display: flex;
    align-items: flex-start;
    padding: 30rem 0 0 0;
}

.schedules-wrap-bottom-left {
    margin-top: 80rem;
}

.schedules-wrap-bottom-item img {
    object-fit: contain;
}

.schedules-wrap-bottom-item-icon {
    width: 124rem;
    margin-right: 76rem;
}

.schedules-wrap-bottom-item .info {
    padding-bottom: 30rem;
    border-bottom: 1rem solid #fff;
}

.schedules-wrap-bottom-item .bd-none {
    border-bottom: none;
}

.product-schedules-bj{
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    background-color: #062031;
}

.product-content-img{
    width: calc(100vw - 400rem);
    margin: 0 auto;
    padding: 40rem 0;
    overflow: hidden;
}
.product-content-img img{
    width:100%;
}

.product-schedules{
    width: calc(100vw - 400rem);
    margin: 0 auto;
    padding: 40rem 0;
    overflow: hidden;
    align-items: center;
}

.product-schedules-title{
    width:100%;
    text-align: center;
    color: #fff;
    font-size: var(--pc-biggest-title);
    font-weight: bold;
    padding: 30rem 0;
}
.product-schedules-description{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
.product-schedules-img{
    width: 30%;
    display: flex;
    align-items: center;
}

.product-schedules-content{
    width: 70%;
}
.product-schedules-content-item{
    width: 100%;
    overflow: hidden;
    padding-bottom: 10rem;
}

.product-schedules-content-item-img{
    width: 160rem;
    float: left;
    padding-right: 20rem;
}
.product-schedules-content-item-text{
    width: calc(100vw*0.7 - 470rem);
    float: left;
    color: #fff;
}
.product-schedules-content-item-text-title{
    font-size: var(--pc-title);
    font-weight: bold;
    line-height: 60rem;
}

.product-schedules-content-item-content{
    width: 100%;
    padding: 10rem 0;
    font-size: var(--pc-content);

}
.border-bottom{
    border-bottom: 1px solid #fff;
}

.product-schedules-content-item-mobile{
    display: none;
}

.app-wrap {
    width: calc(100vw - 400rem);
    margin: 0 auto;
    padding: 30rem 0;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 45% 55%;
    align-items: center;
}

.app-wrap-left-title{
    font-size: var(--pc-title);
    margin-top: 20rem;
}

.app-wrap-left .app-wrap-left-content {
    font-size: var(--pc-content);
    margin-top: 20rem;
}

.app-wrap-right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-left: 20rem;
}

.app-wrap-right img {
    object-fit: contain;
    margin-top: 50rem;
}

.app-wrap-right .cat-2 {
    margin-top: 100rem;
}

.bottom-wrap-bj{
    width: 100vw;
    padding: 30rem 0;
}

.bottom-wrap {
    width: calc(100vw - 400rem);
    background-color: #1E2738;
    margin: 0 auto;
    padding: 20rem 10rem;
}
.bottom-wrap table{
    display: block;
    width:100%;
    border-radius: 20rem;
    border: 1px solid #9d9d9d;
    border-top:0;
}

.bottom-wrap table tr{
    display: block;
    border-top: 1px solid #9d9d9d;
}
.bottom-wrap table tr:nth-child(2n){
    background-color:#fff;
}
.bottom-wrap table tr:last-child{
    border-radius: 0 0 20rem 20rem;
}
.bottom-wrap table .firstRow{
    border-top: 0;
}
.firstRow th{
    display: block;
    background-color:#17ac64;
    border-radius: 20rem 20rem 0 0;
    color:#fff;
    font-size: var(--pc-title);
    font-weight: bold;
    padding: 10rem 20rem;
}

.bottom-wrap table tr td{
    padding: 5rem 20rem;
    font-size: var(--pc-content);
}

.bottom-wrap table tr td p,strong{
    word-break: break-word;
}

.bottom-wrap img{
    width: 100%;
}
.bottom-wrap-item {
    padding-top: 20rem;
    box-sizing: border-box;
    display: grid;
}

.bottom-wrap-item:nth-child(even) {
    grid-template-columns: 1fr .8fr;
}

.bottom-wrap-item:nth-child(odd) {
    grid-template-columns: .8fr 1fr;
}


.bottom-wrap-item-desc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 60rem;
    box-sizing: border-box;
}

.bottom-wrap-item-desc-title {
    font-size: var(--pc-title);
    color: #FFFFFF;
    font-weight: bold;
}

.form-wrap {
    width: 100vw;
    padding: 0 28rem;
    box-sizing: border-box;
    margin-bottom: 62rem;
}

#comment_swiper {
    background-color: #F4F4F6 !important;
}

.review-container {
    background-color: #F4F4F6;
    padding-top: 30rem;
}

.review-container-title {
    margin-left: 200rem;
    color: #3D3F4F;
}

.review-container-title {
    font-size: 54rem;
    font-weight: bold;
}

.product-desc {
    font-size: var(--pc-content);
    color: #FFFFFF;
    margin-top: 20rem;
}
.product-link{
    font-size: var(--pc-content);
    margin-top: 20rem;
}

.schedules-wrap-bottom-mobile {
    display: none;
}

.content-description > video {
    width: 100% !important;
    border-radius: 40rem !important;
    margin-bottom: 200rem !important;
}

.product-video{
    width: 100% !important;
    margin: 0 auto;
    padding: 40rem 0;
}

@media (min-width: 846px) {
    .product-container {
        width: calc(100vw - 400rem) !important;
        padding: 20rem 0;
    }
    .bottom-wrap-item-img{
        border-radius: 50rem;
    }
}

@media (max-width: 845px) {
    .product-container {
        height: auto !important;
        padding: 10rem 20rem !important;
    }
    .product-content{
        font-size: 16rem;
    }
    .product-swiper{
        height: 335rem !important;
    }
    .preview{
        height: 57rem !important;
    }
    .product-swiper-item {
        border-radius: 10rem !important;
    }
    .product {
        padding-top: 0;
    }
    .border-bottom{
        border: 0;
    }
    .swiper-right-title .title {
        font-size: var(--mobile-biggest-title);
        font-weight: bold;
    }

    .review-star {
        width: 7rem !important;
    }

    .swiper-right-review-total {
        font-size: 15rem !important;
    }

    .swiper-right-type {
        border-radius: 4rem !important;
        border-color: #17AC64;
        padding: 2rem 30rem !important;
    }

    .swiper-right-type-price {
        font-size: 15rem !important;
        font-weight: bold !important;
    }

    .swiper-right-type-name {
        font-size: 15rem !important;
    }

    .swiper-right-review {
        margin-top: 0rem !important;
    }

    .swiper-right-type-active .swiper-right-type-name {
        font-weight: bold !important;
    }

    .swiper-right-text {
        font-size: var(--mobile-content) !important;
        margin-top: 0 !important;
    }

    .swiper-right-title .stitle {
        font-size: var(--mobile-title);
    }

    .product-swiper {
        margin-top: 13rem !important;
    }

    /* .preview {
        margin: 50rem 0 30rem 0 !important;
    } */

    .preview .arrow-left {
        width: 20rem !important;
        left: -20rem !important;
        background-size: 50% !important;
    }

    .preview .arrow-right {
        width: 20rem !important;
        right: -20rem !important;
        background-size: 50% !important;
    }
    .product-schedules{
        padding: 10rem 0;
    }
    .preview .swiper-slide {
        width: 44rem !important;
    }

    .schedules-wrap {
        padding: 36rem 20rem 77rem 20rem !important;
        height: auto;
    }
    product-content-img{
        width: 100% !important;
    }

    .schedules-wrap-title {
        font-size: 20rem;
        margin-bottom: 10rem;
    }

    .schedules-wrap-stitle {
        font-size: 15rem;
        margin-bottom: 40rem;
    }
    .product-schedules-content-item-text{
        width: 100%;
        float: none;
    }

    .schedules-wrap-bottom {
        display: none;
    }

    .schedules-wrap-bottom-mobile {
        display: block;
    }

    .schedules-wrap-bottom-mobile {
        width: 100%;
        display: flex;
        flex-direction: column;
        text-align: left;
    }

    .schedules-wrap-bottom-mobile .schedules-title {
        font-size: 20rem;
        margin-bottom: 10rem;
    }

    .schedules-wrap-bottom-mobile .schedules-desc {
        font-size: 15rem;
        margin-bottom: 10rem;
    }

    .schedules-wrap-bottom-mobile .schedules-img-wrap {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .schedules-wrap-bottom-mobile .schedules-img {
        width: 211rem;
    }

    .product-schedules{
        width: calc(100vw - 20rem);
    }
    .product-schedules p{
        margin: 0;
        padding: 0;
    }
    .product-schedules-title{
        font-size: var(--mobile-biggest-title);
        padding: 10rem 0;
    }
    .product-schedules-content{
        width: calc(100vw - 20rem);
        margin: 0 auto;
    }
    .product-schedules-content-item-mobile{
        display: block;
    }
    .product-schedules-img{
        display: none;
    }
    .product-schedules-content-item-img{
        display: none;
    }
    .product-schedules-content-item{
        width: 100%;
    }
    .product-schedules-content-item-text-title{
        font-size: var(--mobile-title);
        text-align: center;
    }
    .product-schedules-content-item-content{
        border-bottom: 0;
        font-size: var(--mobile-content);
    }
    .product-schedules-content-item-mobile{
        text-align: center;
    }
    .app-wrap{
        width: calc(100vw - 20rem);
        display:block;
        padding: 0;
    }
    .app-wrap-right{
        display:block;
    }
    .bottom-wrap{
        width: calc(100vw - 20rem);
        padding: 10rem 23rem;
    }
    .firstRow th {
        font-size: var(--mobile-title);
    }
    .bottom-wrap table tr td{
        font-size: var(--mobile-content);
        padding: 5rem 10rem;
    }
    .swiper-right-button-box {
        justify-content: flex-start !important;
        height: 42rem;
    }

    .swiper-right-button {
        font-size: 15rem !important;
        width: 315rem !important;
        padding: 10rem 20rem !important;
        text-align: center;
    }

    .swiper-right-button span {
        margin-right: 0 !important;
    }

    .content-description > video {
        width: calc(100vw - 80rem) !important;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 10rem !important;
        margin-bottom: 40rem !important;
    }

    .product .app-wrap {
        padding: 0 40rem;
        display: flex;
        flex-direction: column;
    }

    .app-wrap-left-title {
        text-align: center;
        font-size: var(--mobile-title);
        margin: 0 auto;
        padding: 10rem 0;
        margin-top: 20rem;
    }

    .app-wrap-left .app-wrap-left-content {
        margin-top: 14rem;
        font-size: var(--mobile-content);
    }

    .app-wrap {
        height:  auto;
    }

    .app-wrap-right {
        margin: 0;
    }

    .app-wrap-right .cat-1 {
        width: 100%;
        margin-top: 20rem;
    }

    .app-wrap-right .cat-2 {
        width: 100%;
    }

    .bottom-wrap-bj{
        padding: 10rem 0;
    }
    .bottom-wrap-item {
        display: flex;
        padding: 0;
    }

    .bottom-wrap-item:nth-child(odd) {
        flex-direction: column-reverse;
    }

    .bottom-wrap-item:nth-child(even) {
        flex-direction: column;
    }
    
    .bottom-wrap-item-desc {
        padding: 0;
    }

    .bottom-wrap-item-desc-title {
        text-align: center;
        font-size: var(--mobile-title);
        padding: 10rem 0;
        margin: 0;
        margin-top: 20rem;
    }

    .bottom-wrap-item-desc .product-desc {
        font-size: var(--mobile-content);
        margin: 0;
        padding: 10rem 0;
    }
    .bottom-wrap-item-desc .product-link {
        font-size: var(--mobile-content);
        margin: 0;
        padding: 10rem 0;
    }
    .product-content-img{
        width: 100%;
    }

    .bottom-wrap-item-img {
        border-radius: 10rem;
        width: calc(100%);
    }

    .product .form-wrap {
        padding: 0;
    }

    .review-container {
        padding-top: 10rem;
    }

    .review-container-title {
        margin-left: 10rem;
        font-size: 20rem;
        margin-bottom: 0;
    }
}