.card-list-page .section{background-color:#fff;overflow:auto;width:100%;}
.card-list-page .section .wrapper{width:1180px;margin:0 auto;}
.card-list-page .section h1{font-size:40px;color:#ffffff;letter-spacing:2px;line-height:40px;font-family:fangzheng-unionpay-sc;}
.card-list-page .section h1,.card-list-page .section h2{font-family:fangzheng-unionpay-sc;text-align:center;font-weight:400;}
.card-list-page .section h2{font-size:40px;color:#222;letter-spacing:2px;line-height:40px;margin-top:80px;}
.card-list-page .section h3{font-family:fangzheng-unionpay-sc;font-weight:400;}
.card-list-page .section p.sub-head{text-align:center;line-height:20px;letter-spacing:16px;font-size:16px;color:rgba(34,34,34,.7);margin-top:20px;}
/*.card-list-page .section p.sub-head-spread{}*/

.card-list-page .section-top{width:100%;height:580px;margin-top:29px;background-size:cover;}
.card-list-page .section-top .banner{background:url(../../resources/images/card-list/section-top-background.png) 50% no-repeat;}
.card-list-page #card-list-long-line{width: 306px;}
.card-list-page #not-top-h2{padding-top:80px;border-top: 1px solid #E1E1E1}

.card-list-page .card-list .effect-gimble,.card-list-page .card-list .effect-stage{position:relative;transform-style:preserve-3d;perspective:500px;}
.card-list-page .card-list .effect-gimble{display:block;height:228px;width:361px;transition:transform .35s ease-in-out;}
.card-list-page .card-list .effect-gimble.left{transform:rotateY(10deg);}
.card-list-page .card-list .effect-gimble.right{transform:rotateY(-10deg);}
.card-list-page .card-list .effect-trigger_left{content:"";display:block;position:absolute;top:0;left:0;height:228px;width:50%;z-index:6;}
.card-list-page .card-list .effect-trigger_right{content:"";display:block;position:absolute;top:0;right:0;height:228px;width:50%;z-index:6;}
.card-list-page .card-list .cards{margin-top:51px;margin-bottom: 91px}
.card-list-page .card-list .cards>li{height:206px;background:#f5f5f5;margin-bottom:62px;}
.card-list-page .card-list .cards>li:after,.card-list-page .card-list .cards>li:before{content:"\0020";display:block;overflow:hidden;visibility:hidden;width:0;height:0;}
.card-list-page .card-list .cards>li:after{clear:both;}
.card-list-page .card-list .card{display:inline-block;width:361px;height:228px;background:transparent;box-sizing:border-box;margin-left:80px;margin-top:-11px;margin-bottom:-11px;float:left;}
.card-list-page .card-list .card_img{width:361px;border-radius:12px;box-shadow:0 .5rem 1rem rgba(0,0,0,.2);position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);pointer-events:none;}
.card-list-page .card-list .cards>li:nth-child(2n) .card{float:right;margin-left:0px;margin-right:80px;}
.card-list-page .card-list .cards>li:nth-child(2n) .card-details{margin-left:100px;margin-right:50px;}
.card-list-page .card-list .card-details{height:148px;width:589px;display:inline-block;margin-top:29px;margin-right:90px;margin-left:60px;box-sizing:border-box;}
.card-list-page .card-list .card-details h3{display:inline-block;margin-bottom:14px;position:relative;font-size:28px;line-height:32px;letter-spacing: 2px;}
.card-list-page .card-list .card-details h3 a{color:#222;text-decoration:none;}
.card-list-page .card-list .card-details p{font-size:20px;line-height:24px;letter-spacing:1px;color:#dd2c34;margin-bottom: 20px}
.card-list-page .card-list .card-details ul{vertical-align:top;margin-bottom: 31px}
.card-list-page .card-list .card-details ul.card-details_list{display:inline-block;width:289px;}
.card-list-page .card-list .card-details ul.card-details_list li:nth-child(2){width: 306px;}

.card-list-page .card-list .card-details ul.single{width:100%;}
.card-list-page .card-list .card-details ul li{position:relative;font-size:16px;line-height:20px;letter-spacing:0.5px;margin-bottom: 16px; overflow: hidden;}
.card-list-page .card-list .card-details ul li span.card-details_icon{position:absolute;display: block;height: 16px;margin-top:2px;background: url("../../resources/images/card-list/checkbox@2x.png") no-repeat center; background-size: 16px 16px;width: 16px;}
.card-list-page .card-list .card-details ul li div.card-details_line{margin-left:25px;float: left;}
/*.card-list-page .card-list .card-details ul li:before{content:"";display:block;position:absolute;top:50%;left:-25px;height:16px;width:16px;background:url("../images/card-list/checkbox@2x.png") 50% no-repeat;background-size:14px 14px;}*/

.card-list-page .section-bottom{width:100%;height:400px;background:#CCCCCC url(../../resources/images/card-list/section-bottom-background-new@3x.png) 50% no-repeat;background-size:cover;}
.card-list-page .section-bottom .bottom-wrapper{width: 1180px;margin: 0 auto;}
.card-list-page .section-bottom .bottom-wrapper .bottom-text{margin-left: 7%;padding-left: 20px;}
.card-list-page .section-bottom h4{font-family:fangzheng-unionpay-sc;font-size:40px;line-height:40px;letter-spacing:2px;color:#ffffff;margin-top:71px;}
.card-list-page .section-bottom p{ font-size:24px;line-height:28px;letter-spacing:1px;color:#ffffff;margin-top:30px;}
.card-list-page .section-bottom .bottom_icon{margin-top:30px;height: 60px;}
.card-list-page .section-bottom .icon_description{float:left;width: auto;margin-left: 21px;margin-top: 6px;}
.card-list-page .section-bottom .icon_description p{ font-size:14px;line-height:24px;letter-spacing:0.5px;color:#ffffff;;margin-left:0px;margin-top: 0px;margin-bottom: 0px;}
.card-list-page .section-bottom .up_icon{background: url(../../resources/images/card-list/upicon@2x.png) 50% no-repeat;float:left;background-size: 60px;width:60px;height: 60px;}
.card-list-page .section-bottom .QR_icon{background: url(../../resources/images/card-list/QRicon@2x.png) 50% no-repeat;float:left;background-size: 60px;width:60px;height: 60px;margin-left: 20px;}
.card-list-page .section-bottom .bottom_btn{height:40px;line-height:40px;margin-top:30px;color: #222222;background-color: #ffffff;border:1px solid #E5E5E5;border-radius: 20px;font-size:16px;line-height:20px;letter-spacing:1px;color:#222222;padding: 10px 0;}

.card-list-page .pc-banner{background:#CCCCCC url("../../resources/images/card-list/bannerBackground.png") no-repeat center;height:580px;width: 100%;}
.card-list-page .pc-banner .wrapper{margin: 0 auto;}
.card-list-page .pc-bannerList{width: 100%;height:502px;padding-top: 60px;}
.card-list-page .pc-bannerList h2{font-family: fangzheng-unionpay-sc;line-height:40px;font-size:40px;color:#ffffff;letter-spacing: 2px;text-align: center;}

.card-list-page .card-description {text-align: center;width: 200%;margin-left: -50%;margin-top: 40px;display: none;}
.card-list-page .card-description h5{line-height:28px;font-size:24px;color:#ffffff;letter-spacing: 1px;margin:0px;}
.card-list-page .card-description p{line-height:20px;font-size:16px;color:#ffffff;letter-spacing: 0.5px;margin: 20px 0 0;}
.card-list-page .box .list .active{display: block;}

.card-list-page .box{margin-top: 40px;width: 100%;height: 362px;position: relative;}

.card-list-page .box .list{width: 85%;height: 100%;position: absolute;left: 0;right: 0; margin: 0 auto;height: 100%;}


.card-list-page .box li{position: absolute;top: 0;left: 0;opacity: 0;transition: all 0.3s ease-out;width: 403px;height: auto;}
.card-list-page .box img{width: 100%;height: 100%;border:none;}
.card-list-page .box .a1{transform:translate3d(0px,0,0) scale(0.8);transform-origin:0 50%;opacity: 1;z-index: 2;}
.card-list-page .box .a2{transform:translate3d(69.5%,0,0) scale(1);z-index: 3;opacity: 1;}
.card-list-page .box .a3{transform:translate3d(144%,0,0) scale(0.8);transform-origin:100% 50%;opacity: 1;z-index: 2;}

.card-list-page .selectBanner{position: relative;margin:auto;margin-top:40px;overflow:hidden;width:90px;}
.card-list-page .selectBanner span{cursor: pointer;display:block;width: 8px;height:8px;text-indent: -9999px;border-radius: 50%;background: rgba(255,255,255,0.8);float: left;margin:0 5px;}
.card-list-page .selectBanner .selected {background:red;width:24px;height:8px;background:#DD2C34;opacity: 1;filter:Alpha(opacity=100);border-radius:5px;animation:load 5S ease-in;-webkit-animation:load 5S linear;}
.card-list-page .class_after:after{position: absolute;opacity: 0.2;background: #000;content: "";top: 0;right: 0;bottom: 0;left: 0;margin: auto;border-radius: 14px;}
@media (max-width:1220px) {
    .card-list-page .pc-banner{height:530px;}
    .card-list-page .section .wrapper{width:100%;margin:0 auto;padding-left:5.4%;padding-right:5.4%;}
    .card-list-page .section-bottom .bottom-wrapper{width:89.3%;}

    .card-list-page .card-list .card{display:inline-block;width:361px;height:228px;background:transparent;box-sizing:border-box;margin-left:7%;margin-right:0px;margin-top:-11px;margin-bottom:-11px;float:left;}
    .card-list-page .card-list .card-details{height:148px;width:41%;display:inline-block;margin-top:20px;margin-right:7%;margin-left:0px;box-sizing:border-box;float: right}
    .card-list-page .card-list .cards>li:nth-child(2n) .card-details{float:left;margin-right:0px;margin-left:7%;}
    .card-list-page .card-list .cards>li:nth-child(2n) .card{float:right;margin-right:7%;margin-left:0px;}

    .card-list-page #card-list-long-line{width:auto;}

    .card-list-page .card-list .card-details h3{display:inline-block;margin-bottom:10px;position:relative;font-size:25px;line-height:27px;letter-spacing: 2px;}
    .card-list-page .card-list .card-details p{font-size:20px;line-height:22px;letter-spacing:1px;color:#dd2c34;margin-bottom: 10px}
    .card-list-page .card-list .card-details ul{vertical-align:top;margin-bottom:0px}
    .card-list-page .card-list .card-details ul.card-details_list{display:inline-block;width:49%;}
    .card-list-page .card-list .card-details ul li{position:relative;font-size:16px;line-height:18px;letter-spacing:0.5px;margin-bottom:6px; overflow:hidden;}
    .card-list-page .card-list .card-details ul li span.card-details_icon{position:absolute;display: block;height: 16px;background: url("../../resources/images/card-list/checkbox@2x.png") no-repeat center; background-size: 13px 13px;width: 16px;}
    .card-list-page .card-list .card-details ul li div.card-details_line{margin-left:23px;float: left;}
    .card-list-page .card-list .card-details ul.card-details_list li:nth-child(2){width:auto;}

    .card-list-page .box{margin-top: 40px;width: 100%;height: 362px;position: relative;}
    .card-list-page .card-description{margin-top: 20px;}
    .card-list-page .box .list{width: 85%;height: 100%;position: absolute;left: 0;right: 0; margin: 0 auto;height: 100%;}
    .card-list-page .box li{width: 41%;height: auto;}
    .card-list-page .box img{width: 100%;height: 100%;border:none;}
    .card-list-page .box .a2{transform:translate3d(69.5%,0,0) scale(1);z-index: 3;opacity: 1;}
    .card-list-page .box .a3{transform:translate3d(144%,0,0) scale(0.8);transform-origin:100% 50%;opacity: 1;z-index: 2;}
    .card-list-page .selectBanner{margin:auto;margin-top:0;}
    }


@media (max-width:950px) {
    .card-list-page .pc-banner{height:530px;width: 100%;}
    .card-list-page .pc-bannerList{width: 100%;height:350px;position: relative;}
    .card-list-page .pc-bannerList h2{font-family: fangzheng-unionpay-sc;line-height:30px;font-size:28px;color:#ffffff;letter-spacing: 2px;text-align: center;}

    .card-list-page .card-description {text-align: center;width: 200%;margin-left: -50%;margin-top: 40px;}
    .card-list-page .card-description h5{line-height:28px;font-size:24px;color:#ffffff;letter-spacing: 1px;margin:0px;}
    .card-list-page .card-description p{line-height:20px;font-size:14px;color:#ffffff;letter-spacing: 0.5px;margin: 20px 0 0;}

    .card-list-page .section .wrapper{width:100%;margin:0 auto;padding-left:5.4%;padding-right:5.4%;}
    .card-list-page .card-list .card{display:inline-block;width:260px;height:228px;background:transparent;box-sizing:border-box;margin-left:7%;margin-right:0px;margin-top:-11px;margin-bottom:-11px;float:left;}
    .card-list-page .card-list .card-details{height:148px;width:290px;display:inline-block;margin-top:20px;margin-right:7%;margin-left:0px;box-sizing:border-box;float: right}
    .card-list-page .card-list .cards>li:nth-child(2n) .card-details{float:left;margin-left:7%;margin-right:0px;}
    .card-list-page .card-list .cards>li:nth-child(2n) .card{float:right;margin-right:7%;margin-left:0px;}

    .card-list-page .card-list .card-details h3{display:inline-block;margin-bottom:10px;position:relative;font-size:22px;line-height:27px;letter-spacing: 2px;}
    .card-list-page .card-list .card-details p{font-size:16px;line-height:18px;letter-spacing:1px;color:#dd2c34;margin-bottom: 10px}
    .card-list-page .card-list .card-details ul{vertical-align:top;margin-bottom:0px}
    .card-list-page .card-list .card-details ul.card-details_list{display:inline-block;width:289px;}
    .card-list-page .card-list .card-details ul li{position:relative;font-size:16px;line-height:18px;letter-spacing:0.5px;margin-bottom:6px; overflow:hidden;}
    .card-list-page .card-list .card-details ul li span.card-details_icon{position:absolute;display: block;height: 16px;background: url("../../resources/images/card-list/checkbox@2x.png") no-repeat center; background-size: 13px 13px;width: 16px;}
    .card-list-page .card-list .card-details ul li div.card-details_line{margin-left:23px;float: left;}

    .card-list-page .card-list .effect-gimble{display:block;height:228px;width:260px;transition:transform .35s ease-in-out;}
    .card-list-page .card-list .card_img{width:260px;border-radius:12px;box-shadow:0 .5rem 1rem rgba(0,0,0,.2);position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);pointer-events:none;}
}

@media (max-width: 760px){
    .card-list-page .section-top{width:100%;height:450px;margin-top:0px;background:url(../../resources/images/card-list/top-background.png) 50% no-repeat;background-size:cover;}

    .card-list-page .banner-cartList{width:100%; height: 340px;position: relative;background:#CCCCCC url("../../resources/images/card-list/bannerBackground.png") no-repeat center;background-size: cover;}
    .card-list-page .banner-cartList ul{width: 100%;height: 340px;overflow: hidden;}
    .card-list-page .banner-cartList ul li{float: left;width: 100%;text-align: center;}
    .card-list-page .banner-cartList ul li h2{text-align: center;font-family:fangzheng-unionpay-sc;color: #ffffff;font-size:24px;line-height:26px;letter-spacing:2px;margin-top:30px;}
    .card-list-page .banner-cartList ul li img{width:220px;height: 139px;background-size: contain;margin-top:30px}
    .card-list-page .banner-cartList ul li p{text-align: center;font-family:fangzheng-unionpay-sc;font-size: 20px;line-height:22px;letter-spacing:2px;color: #ffffff;margin-top: 30px;}
    .card-list-page .banner-cartList ul li span{display: block; font-size: 13px;color: #ffffff;line-height: 16px;letter-spacing:0.5px;margin-top: 10px;}
    .card-list-page .banner-cartList .bx-controls .bx-controls-direction{display: none;}
    .card-list-page .banner-cartList .bx-pager{margin-top: 16px;}

    .card-list-page .section .wrapper{width:100%;margin:0 auto;padding:8px 5.4%;}
    .card-list-page .section h2{font-family: fangzheng-unionpay-sc;font-size:24px;line-height:26px;color:#222222;letter-spacing:2px;text-align: center;margin-top:50px;}
    .card-list-page .section h3{font-family:fangzheng-unionpay-sc;font-weight:400;}
    .card-list-page .section p.sub-head{ text-align:center;font-size:11px;line-height:14px;letter-spacing:6px;color:#646464;margin-top:12px;}
    .card-list-page #not-top-h2{padding-top:50px;border-top: 1px solid #E1E1E1}

    .card-list-page .card-list .card-details{font-size:14px;width:100%;height:auto;display:inline-block;margin-left:0px;margin-right:0px;margin-top:-20px;padding-top:40px;padding-bottom:20px;padding-left:15%;padding-right:15%;box-sizing:border-box;background:#f5f5f5}
    .card-list-page .card-list .card-category h3{font-family: fangzheng-unionpay-sc;display:block;line-height:22px;font-size:20px;letter-spacing: 2px;text-align: center;}
    .card-list-page .card-list .card-category p{font-family: fangzheng-unionpay-sc;line-height:18px;font-size:16px;color:#DD2C34;letter-spacing: 1px;text-align: center;margin-top: 20px;}
    .card-list-page .card-list .card-details ul{vertical-align:top;}
    .card-list-page .card-list .card-details ul.card-details_list{display:block;width:236px;margin:0 auto}
    .card-list-page .card-list .card-details ul.single{width:100%;}
    .card-list-page .card-list .card-details ul li{position:relative;font-size:13px;line-height:16px;margin-left:0px;letter-spacing:0.5px;padding-left:0px;padding-right:0px;margin-bottom:10px;}
    .card-list-page .card-list .card-details ul.single{width:100%;}
    .card-list-page .card-list .card-details ul li span.card-details_icon{position: absolute;display: block;height:16px;background: url("../../resources/images/card-list/checkbox@2x.png") no-repeat center;background-size:10.7px 10.7px;width:16px;}
    .card-list-page .card-list .card-details ul li div.card-details_line{margin-left:21px;float: left;}
    .card-list-page .card-list .cards>li:nth-child(2n) .card-details{float:left;margin-left:0px;margin-right:0px;}

    .card-list-page .card-details a{color: #dd2c34;}
    .card-list-page .card-list .card{width:100%;display:block;height:164px;background:transparent;box-sizing:border-box;margin-top:20px;margin-left:0px;margin-bottom:0px;float:left;}
    .card-list-page .card-list .effect-gimble{perspective:500px;display:block;height:164px;width:260px;margin:0 auto;}
    .card-list-page .card-list .card_img{width:260px;height:164px;border-radius:12px;box-shadow:0 .5rem 1rem rgba(0,0,0,.2);position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);pointer-events:none;}

    .card-list-page .card-list .cards{margin-top:50px;margin-bottom:50px;font-size:0;}
    .card-list-page .card-list .cards>li{ font-size:0;margin-bottom:50px;background: rgba(246, 243, 255, 0);height:auto;}
    .card-list-page .card-list .cards>li:after,.card-list-page .card-list .cards>li:before{content:"\0020";display:block;overflow:hidden;visibility:hidden;width:0;height:0;}
    .card-list-page .card-list .cards>li:after{clear:both;}
    .card-list-page .card-list .cards>li:nth-child(2n) .card{float:left;}

    .card-list-page .section-bottom{width:100%;height:200px;background:url(../../resources/images/card-list/section-bottom-background.png) 50% no-repeat;background-size:cover;}
    .card-list-page .section-bottom h4{font-family:fangzheng-unionpay-sc;font-size:24px;line-height:26px;letter-spacing:2px;color:#ffffff;text-align:center;margin-left:0px;margin-top:36px;}
    .card-list-page .section-bottom p{font-size:13px;line-height:13px;letter-spacing:0.5px;color:#ffffff;text-align:center;margin-left:0px;margin-top:20px;}
    .card-list-page .section-bottom .bottom_btn{height:30px;width:120px;line-height:30px;color:#ffffff;background-color:#DD2C34;margin-left:auto;margin-top:20px;border:0px;padding: 0;font-size: 14px}
}