.container-fluid.container {
    max-width: 1560px;
    width: 100%;
    padding: 40px 20px 0 20px;
    margin: 0 auto;
}

/* kv */
.kv-container {
    display: flex;
}

.swiper-container.swiper-container-horizontal.kv_swiper {
    background-size: cover;
}

.swiper-container.swiper-container-horizontal {
    width: 100%;
    position: relative;
    background-size: cover;
}

/*20220613 Amy ·s»Ý¨D KV«eºÝ¼Ë¦¡§ï¬°º¡ª©§e²{*/
.swiper-container {
    position: relative;
    background-size: cover;
}

/*20220613 Amy ·s¼W½ü¼½¹Ï¥ª¥k«ö¶s ¨S¦³¤W©Î¤U±i¹Ï®ÉÁôÂëö¶s*/
.swiper-button-prev.index,
.swiper-button-next.index {
    position: absolute;
    border: 0px;
    width: 40px;
    height: 40px;
    margin: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto;
    transform: translateY(-50%);
}

.swiper-button-disabled.index {
    opacity: 0;
    display: none;
}

.swiper-button-next.index {
    background-image: url("../../images/index/liteon-index-kvbtn-next.svg");
}

    .swiper-button-next.index:hover {
        background-image: url("../../images/index/liteon-index-kvbtn-next-hover.svg");
    }

.swiper-button-prev.index {
    background-image: url("../../images/index/liteon-index-kvbtn-pre.svg");
}

    .swiper-button-prev.index:hover {
        background-image: url("../../images/index/liteon-index-kvbtn-pre-hover.svg");
    }


.kv_swiper.swiper-container-horizontal > .swiper-pagination-bullets,
.kv_swiper .swiper-pagination-custom,
.kv_swiper .swiper-pagination-fraction {
    bottom: 20px;
    padding: 0 38px;
}

.kv_swiper .swiper-pagination-bullet,
.promotion_swiper .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background-color: transparent;
    border: 1px solid #FFA000;
    opacity: 1;
}

.kv_swiper.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 7.5px;
}

.kv_swiper .swiper-pagination-bullet-active,
.promotion_swiper .swiper-pagination-bullet-active {
    background-color: #FFA000;
}

/*20220613 Amy ·s»Ý¨D ¹Ï¤ù©T©w°ª¥ª¥k¾B¸n*/
.kv_swiper .swiper-slide .img_block {
    background-size: cover;
    background-position: center center;
    height: 450px;
    max-width: 1920px;
    margin: auto;
}

.container {
    max-width: 1560px;
    width: 100%;
    padding: 0 20px;
}

/*20220613 Amy ·s»Ý¨D ·s¼W1560Â_ÂI*/
@media screen and (max-width:1560px) {

    .container-fluid.container {
        max-width: 1200px;
        width: 100%;
        padding: 40px 20px 0 20px;
        margin: 0 auto;
    }
}

@media screen and (max-width: 1200px) {

    .container-fluid.container {
        padding: 40px 20px;
    }

    .swiper-container.swiper-container-horizontal {
        width: 1200px;
    }
}



@media screen and (max-width:768px) {

    .container-fluid.container {
        padding: 0px 15px 0 15px;
    }

    .swiper-container.swiper-container-horizontal.kv_swiper {
        margin: 0;
    }

    .kv_swiper.swiper-container-horizontal > .swiper-pagination-bullets,
    .kv_swiper .swiper-pagination-custom,
    .kv_swiper .swiper-pagination-fraction {
        bottom: 15px;
    }

    .kv_swiper .swiper-slide .img_block {
        padding-top: 94%;
        height: auto;
    }

    .swiper-container.swiper-container-horizontal {
        width: 100%;
    }
}



/* news& promotion */
.news_promotion_block {
    display: flex;
    flex-wrap: nowrap;
    margin-top: 40px;
}

.main_title {
    font-size: 36px;
    line-height: 48px;
    color: #888888;
    margin-bottom: 20px;
}

.news_list {
    display: flex;
    overflow: auto;
}

    .news_list::-webkit-scrollbar {
        display: none;
    }

.news_list {
    -ms-overflow-style: none;
}

    .news_list li {
        /*20220614 Amy ·s»Ý¨D ª©­±½Õ¾ã §ó§ï¼e«×*/
        cursor: pointer;
        width: 365px;
        min-width: 275px;
        margin-right: 20px;
        background-color: #EEF1F3;
    }

        .news_list li.video-content {
            width: 634px;
            height: 460px;
            padding: 75px 65px 75px 65px;
        }

    .news_list .title.video-brief {
        padding: 0px;
        margin: 0px 0px 30px 0px;
        width: 504px;
        height: 32px;
        font-size: 24px;
    }

    .news_list .txt.video-txt {
        padding: 0px;
        margin: 0px;
        margin-bottom: 15px;
        max-height: 120px;
        font-weight: normal;
    }


    .news_list li:nth-child(5) {
        min-width: auto;
        width: 0;
        background-color: transparent;
    }

/* 
.news_list li:last-child {
    margin-right: 0 !important;
} */

.news_head {
    display: flex;
    justify-content: space-between;
}

    .news_head .tag {
        width: 125px;
        line-height: 45px;
        color: #fff;
        text-align: center;
        font-weight: normal;
    }

    .news_head .tag_1 {
        background-color: #00B0FF;
    }

    .news_head .tag_2 {
        background-color: #0A51A7;
    }

    .news_head .tag_3 {
        background-color: #888888;
    }

    .news_head .date {
        color: #888;
        text-align: right;
        padding-right: 20px;
        padding-top: 17px;
    }

.news_list .title {
    color: #1E88E5;
    padding: 0 25px;
    margin: 30px auto 28px;
    font-size: 24px;
    line-height: 32px;
    max-height: 95px;
    height: 95px;
    overflow: hidden;
    font-weight: lighter;
}

.news_list .txt {
    color: #414141;
    padding: 0 25px;
    margin-bottom: 32px;
    font-size: 16px;
    line-height: 24px;
    overflow: hidden;
    max-height: 95px;
}

@media screen and (min-width:769px) {
    .news_list li:hover .title {
        color: #FF9F00;
    }

    .news_list li:nth-child(4) {
        display: none;
    }
}

/*20220613 Amy ·s»Ý¨D ·s¼W1560Â_ÂI video area*/
@media screen and (max-width:1560px) {

    .news_list li {
        cursor: pointer;
        width: 275px;
        min-width: 275px;
        margin-right: 20px;
        background-color: #EEF1F3;
    }

        .news_list li.video-content {
            width: 486px;
            height: 443px;
            padding: 43px 30px 43px 30px;
        }

    .index_permanent_list li.video-content-block {
        height: 443px;
        width: 486px;
    }

    .video-container.index {
        width: 674px;
        height: 443px;
        padding-bottom: 0px;
    }
}


@media screen and (max-width:768px) {
    .main_title {
        font-size: 30px;
        line-height: 42px;
        color: #888888;
        margin-bottom: 20px;
        margin-top: 30px;
    }

    .news_block {
        width: calc(100% + 15px);
    }

    .news_list li:nth-child(3) {
        margin-right: 15px;
    }

    .news_list li:nth-child(4) {
        min-width: 1px;
        background-color: transparent;
    }

    .news_promotion_block {
        margin-top: 0px;
        flex-wrap: wrap;
    }
}


/* promotion */
.promotion_swiper.swiper-container.swiper-container-horizontal {
    /*20220614 Amy ·s»Ý¨D ª©­±½Õ¾ã §ó§ï¼e«×*/
    width: 365px;
    background-color: #EEF1F3;
    height: 325px;
}

.promotion_swiper.swiper-container-horizontal > .swiper-pagination-bullets,
.promotion_swiper .swiper-pagination-custom,
.promotion_swiper .swiper-pagination-fraction {
    bottom: 30px;
}

.promotion_item a {
    display: block;
    width: 100%;
    height: 100%;
    color: #424242;
}

.promotion_img {
    width: 185px;
    height: 185px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin: 15px auto;
}

.promotion_item .title {
    padding: 0 20px;
    text-align: center;
    max-height: 48px;
    overflow: hidden;
    font-size: 16px;
    line-height: 24px;
}

/*video_area_block*/
/*20220615 Amy ·s¼W video area block*/
.video-container.index {
    width: 886px;
    height: 460px;
    padding-bottom: 0px;
}

.video-content-block {
    width: 634px;
    padding: 75px 65px 0 65px;
    background-color: #EEF1F3;
}


.common_btn.video {
    width: 135px;
    height: 45px;
    display: block;
}

.video-head {
    font-size: 36px;
    line-height: 48px;
    color: #888888;
    margin-bottom: 20px;
}

.video-brief {
    color: #1E88E5;
    margin: 20px auto 30px;
    font-size: 24px;
    line-height: 32px;
    max-height: 95px;
    overflow: hidden;
    font-weight: lighter;
}

.video-txt {
    color: #414141;
    margin-bottom: 32px;
    font-size: 16px;
    line-height: 24px;
    overflow: hidden;
    max-height: 95px;
}

.index_permanent_list.video-block {
    margin-bottom: 0px;
    flex-wrap: nowrap;
}

/*20220613 Amy ·s»Ý¨D ·s¼W1560Â_ÂI*/
@media screen and (max-width:1560px) {


    .promotion_swiper.swiper-container.swiper-container-horizontal {
        width: 275px;
        background-color: #EEF1F3;
        height: 325px;
    }

    .video-container.index {
        width: 674px;
        height: 443px;
        padding-bottom: 0px;
    }

    .video-content-block {
        padding: 43px 30px 0 43px;
    }

    .video-brief {
        margin: 0 0 30px;
    }

    .video-txt {
        margin-bottom: 15px;
    }

    .video-content-block {
        width: 486px;
    }
}

@media screen and (max-width:1200px) {
    .video-container.index {
        width: 684px;
    }
}

@media screen and (max-width:768px) {
    .promotion_block {
        width: 100%;
    }

    .promotion_swiper.swiper-container.swiper-container-horizontal {
        width: 100%;
        height: 297px;
    }

    .promotion_item .title {
        max-height: 20px;
    }

    .video-head {
        font-size: 30px;
        line-height: 42px;
        color: #888888;
        margin-bottom: 20px;
    }

    .video-brief {
        margin: 0 0 10px;
    }
}



/* 常é??­å??€ */
.index_permanent {
    margin-top: 50px;
}

.index_permanent_list {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

    .index_permanent_list li {
        overflow: hidden;
        position: relative;
        cursor: pointer;
        margin-bottom: 20px;
        background-color: #EEF1F3;
        margin-right: 0px;
    }

        .index_permanent_list li.video-content-block {
            height: 460px;
            font-size: 30px;
            line-height: 42px;
            color: #888888;
            margin-bottom: 20px;
            margin-top: 30px;
            display: flex;
            overflow: auto;
            list-style: none;
            padding: 0;
            margin: 0;
            width: 486px;
            height: 443px;
            padding: 43px 30px 43px 30px;
        }

    .index_permanent_list img {
        max-width: 100%;
    }

    .index_permanent_list .img_block {
        width: 100%;
        height: 100%;
        background-position: center;
        background-size: cover;
        overflow: hidden;
    }


    .index_permanent_list .title {
        font-weight: bold;
        font-size: 36px;
        line-height: 48px;
    }

    .index_permanent_list .subtitle {
        font-size: 16px;
        line-height: 24px;
    }

.type_3 {
    height: 400px;
}

.type_4 {
    height: 400px;
}




/* ?‹æ??¡hover?ˆæ? */
@media screen and (min-width:769px) {
    .index_permanent_list .img_block img {
        width: 100%;
        max-width: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
    }

    .index_permanent_list .type_3 .img_block {
        width: 51.4%;
        height: 100%;
        position: relative;
    }

        .index_permanent_list .type_3 .img_block img {
        }

    .index_permanent_list .txt_block {
        position: absolute;
        bottom: 0%;
        color: #fff;
        z-index: 20;
        padding: 25px 30px;
        width: 100%;
    }

    .index_permanent_list .type_3::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        background-color: #1E88E5;
        width: 49.6%;
        height: 100%;
    }

    .index_permanent_list .type_3 .txt_block {
        width: 48.6%;
        right: 0;
    }

    .index_permanent_list .img_block::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        background-color: #000;
        opacity: 0.23;
        width: 100%;
        height: 100%;
    }

    /*20220614 Amy ·s»Ý¨D §ó§ï¼e«×*/
    .index_permanent_list .type_1,
    .index_permanent_list .type_3,
    .index_permanent_list .type_4 {
        width: 1000px;
        height: 400px;
    }

    /*20220614 Amy ·s»Ý¨D §ó§ï¼e«×*/
    .index_permanent_list .type_2 {
        width: calc(100% - 1019px);
    }

    .index_permanent_list .left {
        margin-right: 19px;
    }

    .index_permanent_list .hover_block {
        position: absolute;
        opacity: 0;
        pointer-events: none;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        -webkit-transition-duration: .5s;
        transition-duration: .5s;
        -webkit-transition-timing-function: cubic-bezier(.075, .82, .165, 1);
        transition-timing-function: cubic-bezier(.075, .82, .165, 1);
        -webkit-transition-property: opacity, -webkit-transform;
        transition-property: opacity, -webkit-transform;
        transition-property: opacity, transform;
        transition-property: opacity, transform, -webkit-transform;
    }

    .index_permanent_list .type_3 .hover_block {
        width: 51.4%;
    }

    .index_permanent_list .hover_block img {
        max-width: 100%;
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translate(-50%, 0%);
        -moz-transform: translate(-50%, 0%);
        -webkit-transform: translate(-50%, 0%);
        -o-transform: translate(-50%, 0%);
        -webkit-transition-duration: .6s;
        transition-duration: .6s;
        -webkit-transition-timing-function: cubic-bezier(.075, .82, .165, 1);
        transition-timing-function: cubic-bezier(.075, .82, .165, 1);
        -webkit-transition-property: top, -webkit-transform;
        transition-property: top, -webkit-transform;
        transition-property: top, transform;
        transition-property: top, transform, -webkit-transform;
        opacity: 0;
    }

    .index_permanent_list li:hover .hover_block {
        opacity: 1;
        z-index: 5;
        background-color: #fff;
    }

        .index_permanent_list li:hover .hover_block img {
            top: 45%;
            opacity: 1;
            transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
        }

    .index_permanent_list .type_1:hover .hover_block {
        background-color: rgba(0, 176, 255, .85);
    }

    .index_permanent_list .type_4:hover .hover_block {
        background-color: rgba(0, 176, 255, .85);
    }

    .index_permanent_list .type_2:hover .hover_block {
        background-color: rgba(255, 159, 0, .85);
    }

    .index_permanent_list .type_3:hover .hover_block {
        background-color: rgba(30, 136, 229, .9);
    }

    /*20220701 Amy ¼v¤ù§ï¬°´CÅé®w¤W¶Ç*/
    /*.video-container iframe {
    width: 100%;
    height: 100%;
    }*/
    .video-container video {
        width: 100%;
        height: 100%;
    }
}

/*20220613 Amy ·s»Ý¨D ·s¼W1560Â_ÂI*/
@media screen and (max-width:1560px) {
    .index_permanent_list .type_1,
    .index_permanent_list .type_3,
    .index_permanent_list .type_4 {
        width: 767px;
    }

    .index_permanent_list .type_2 {
        width: calc(100% - 787px);
    }

    .index_permanent_list li.video-content-block {
        height: 443px;
    }
}

@media screen and (max-width:1200px) {

    .index_permanent {
        margin-top: 30px;
    }

    .index_permanent_list .type_1, .index_permanent_list .type_3, .index_permanent_list .type_4 {
        width: 767px;
        height: 400px;
    }

    .index_permanent_list .type_2 {
        width: calc(100% - 787px);
    }
}

@media screen and (max-width:768px) {

    .index_permanent_list {
        margin-bottom: 0px;
    }

        .index_permanent_list li {
            height: auto;
            width: 100%;
            margin-bottom: 20px;
        }

        .index_permanent_list .txt_block {
            position: static;
            padding: 0 20px;
        }

        .index_permanent_list .title {
            color: #888888;
            font-size: 24px;
            line-height: 32px;
            padding-top: 15px;
            padding-bottom: 7px;
        }

        .index_permanent_list .subtitle {
            color: #414141;
        }

        .index_permanent_list .img_block {
            text-align: center;
            height: 0;
            padding-top: 56.36%;
        }

        .index_permanent_list .hover_block {
            padding: 20px;
            max-width: 290px;
        }

        .index_permanent_list .type_4 .txt_block {
            padding-bottom: 20px;
        }

        .index_permanent_list .hover_block img {
            max-height: 90px;
        }

        .index_permanent_list .img_block .hide_pc {
            width: 100%;
        }

    .index_permanent_list {
        display: block;
    }

    .video-content-block {
        width: 100%;
    }

    .video-container.index {
        width: 100%;
        height: auto;
        padding-top: 51.5%;
    }

    .video-content-block {
        padding: 30px 20px 40px 20px;
    }

    .index_permanent_list .type_1, .index_permanent_list .type_3, .index_permanent_list .type_4 {
        width: 100%;
        height: auto;
    }

    .index_permanent_list .type_2 {
        width: 100%;
    }
}



/* contact_block */
.contact_block {
    position: relative;
    margin: 30px auto 90px;
}

    .contact_block .img_block {
        overflow: hidden;
    }

    .contact_block .txt_block {
        position: absolute;
        color: #fff;
        top: 25px;
        left: 40px;
    }

    .contact_block .title {
        font-size: 36px;
        line-height: 48px;
    }

    .contact_block .subtitle {
        font-size: 18px;
        line-height: 28px;
    }

    .contact_block .common_btn {
        position: absolute;
        left: 620px;
        top: 45px;
    }

@media screen and (max-width:768px) {
    .contact_block {
        width: 100%;
        background-color: #1E88E5;
        padding: 20px 20px 25px;
        margin: 10px auto 50px;
    }

        .contact_block .txt_block {
            position: static;
        }

        .contact_block .subtitle {
            margin: 10px auto 15px;
        }

        .contact_block .common_btn {
            position: static;
            display: block;
        }
}

.video-container {
    position: relative;
    padding-bottom: 52.28%;
    padding-top: 0px;
    height: 0;
    overflow: hidden;
    background-color: #000;
    padding-bottom: 56.25%;
}



    .video-container iframe,
    .video-container video,
    .video-container object,
    .video-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


        .video-container video.index_video {
            height: 460px;
        }


@media screen and (max-width: 768px) {
    .video-container {
    }
}

/*20220926 Amy ·s¼W¥|­Ó©T©w¶µ¥Ø°Ï¶ô*/
.intro-block {
    display: flex;
    margin-top: 50px;
}

.each-wrapper {
    padding: 0 25px;
}

.intro-block .gray-line {
    background: #F5F5F5;
    height: auto;
    width: 2px;
    margin: 0 8px;
}

.intro-block .title {
    font-size: 24px;
    line-height: 32px;
    color: #888888;
    margin-bottom: 10px;
    padding: 0 25px;
    font-weight: bold;
}

.intro-block .each-block {
    width: 25%;
    position: relative;
}

    .intro-block .each-block + .each-block {
        margin-left: 20px;
    }

    .intro-block .each-block:first-child {
        padding-left: 0;
    }

    .intro-block .each-block:last-child {
        padding-right: 0;
    }

.intro-block .img-block {
    margin: 15px auto;
}

    .intro-block .img-block img {
        display: block;
        margin: 0 auto;
        /*width: -webkit-fill-available;
    width: -moz-fill-available;
    width: -moz-available;*/
        width: 100%;
    }

.intro-block .text-block {
    margin-top: 10px;
    /*padding: 0 25px;*/
    font-size: 16px;
    line-height: 24px;
}

.intro-block .each-block .text-block a:hover,
.intro-block .each-block .text-block li:hover  {
    color: #FF9F00;
}

.intro-block .each-block .text-block a {
    display: block;
}

    .intro-block .text-block ul {
        color: #1E88E5;
        padding-left: 15px;
        margin-bottom: 30px;
        min-height: 26px;
    }

.intro-block .btn-block {
    width: 85px;
    border-radius: 15px;
    background-color: #3B7CAA;
    height: 26px;
    position: absolute;
    bottom: 0px;
    right: 10px;
    text-align: center;
}

    .intro-block .btn-block .more {
        color: #ffffff;
        padding: 3px 0px;
        display: inline-block;
    }

@media screen and (max-width: 1560px) {
}

@media screen and (max-width: 768px) {
    .intro-block {
        display: block;
        margin-top: 0;
    }
    .intro-block .each-block {
        width: 100%;
        margin-top: 30px;
    }
    .intro-block .title {
    padding: 0px;
}
}