body {background-color: #eeedf2;}
.page-wrapper {width: 1200px;margin: auto;}
.page-wrapper .product {background-color: #0182bb;}
.page-content-wrapper {display: flex;justify-content: space-between;width: 100%;margin-top: 10px;}
.page-content-wrapper > .left-wrapper {width: 220px;}
.page-content-wrapper > .right-wrapper {width: 960px;}

.right-wrapper > .content-wrapper {width: 100%;min-height: 768px;padding: 30px;border: 1px solid #D8D7DC;background: #fff;margin-bottom: auto;}
.right-wrapper > .content-wrapper > .title {font-size: 16px;font-weight: bold;color: #0182bb;margin-bottom: 15px;}

.audio-play-btn {display: inline-block;vertical-align: top;margin-left: 15px;width: 25px;height: 25px;line-height: 25px;background: url("../../images/icon/i_audio.png") no-repeat center;cursor: pointer;}
.audio-play-btn.active {background-image: url("../../images/icon/i_audio_play.gif");}
.video-play-btn {position: absolute;display: inline-block;width: 40px;height: 25px;line-height: 25px;left: 20px;bottom: 20px;background: url("../../images/icon/i_play-video.png") no-repeat center;background-size: contain;z-index: 2;cursor: pointer;}
.video-play-btn.center {left: calc(50% - 20px);bottom: calc(50% - 12.5px);}
.no-message {padding: calc(35% - 20px);text-align: center;font-size: 18px;color: #8a8a8a;}

.image-wrapper {display: flex;align-items: center;position: relative;justify-content: space-between;}
.image-wrapper .swiper-container {margin: unset;width: 750px;height: 422px;position: relative;}
.image-wrapper .swiper-container.swiper-extend {width: 898px;height: 505px;}
.image-wrapper .swiper-container.swiper-extend .swiper-slide, .image-wrapper .swiper-container.swiper-extend .swiper-slide img {height: 505px;}
.image-wrapper .swiper-container.swiper-extend .swiper-slide .video-view {width: 898px;height: 505px;}
.image-wrapper .swiper-container .swiper-slide {display: block;height: 422px;overflow: hidden;background-color: #000;text-align: center;}
.image-wrapper .swiper-container .swiper-slide.active {display: block;}
.image-wrapper .swiper-container .swiper-slide img {display: block;margin: auto;height: 422px;cursor: pointer;}
.image-wrapper .swiper-container .swiper-slide .video-view {display: none;margin: unset;width: 750px;height: 422px;position: relative;}
.image-wrapper .swiper-container:hover .swiper-button-prev, .image-wrapper .swiper-container:hover .swiper-button-next {display: flex;}
.image-wrapper .swiper-container .swiper-button-disabled {pointer-events: unset;}
.image-wrapper .swiper-container .swiper-button-prev, .image-wrapper .swiper-container .swiper-button-next {display: none;background: gray;border-radius: 50%;width: 32px;height: 32px;}
.image-wrapper .swiper-container .swiper-button-prev::after, .image-wrapper .swiper-container .swiper-button-next::after {content: '';}
.image-wrapper .gallery-thumbs {position: absolute;top: 0;right: 0;height: 422px;width: 139px;z-index: 1;overflow: hidden;}
.image-wrapper .gallery-thumbs .swiper-slide {box-sizing: border-box;cursor: pointer;overflow: hidden;}
.image-wrapper .gallery-thumbs .swiper-slide.swiper-slide-thumb-active {border: 2px solid #de1b39;}
.image-wrapper .gallery-thumbs .swiper-slide img {height: 78px;}

.about {margin: 20px auto auto auto;clear: both;padding-bottom: 20px;border-bottom: 1px solid #f2f5f7;}
.about .c-b {color: #333;font-size: 19px;}
.about .c-b audio {display: none;}
.about h3 {margin: 10px auto;font-size: 16px;}
.about h3.payment i {display: inline-block;width: 24px;height: 24px;line-height: 24px;background: url("../../assets/icon_common_right.png") no-repeat;cursor: pointer;margin-left: 10px;transform: rotate(90deg);}
.about h3.payment i.up {transform: rotate(-90deg);}
.about h3.intro-title {display: flex;align-items: center;}
.about h3.intro-title + .intro-text {font-size: 15px;}
.about table th {font-size: 17px;padding-right: 10px;padding-bottom: 10px;}
.about table th.c-o {color: #d78560;}
.about table th.c-o.line-through {text-decoration: line-through;color: #0f0f0f;font-size: 12px;}
.about table th a {padding: 2px 5px;vertical-align: middle;background-color: #f2f7f6;color: #0182ba !important;border-radius: 3px;font-size: 14px;font-weight: normal;border: 1px solid #d8d7d2;}
.about table td {font-size: 15px;padding: 3px 10px 3px 0;}
.about .pay {margin-bottom: 20px;}
.about .pay ul {display: flex;}
.about .pay ul li {display: block;text-align: center;margin-right: 60px;}
.about .pay ul li a {color: #000;font-size: 16px;font-weight: 400;}
.about .pay ul li span {display: block;}
.about .pay .close {position: absolute;width: 20px;height: 20px;top: 15px;right: 15px;cursor: pointer;background: url("../../assets/icon_share_close.png") no-repeat center/20px;}
.about .pay .qrcodeCode,
.about .pay .wechatCode {display: none;position: absolute;left: 44%;width: 310px;text-align: center;background: #fff;box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.1);z-index: 1;top: 790px;border-radius: 5px;}
.about .pay .qrcodeCode .title,
.about .pay .wechatCode .title {display: flex;align-items: center;justify-content: center;background: #ececec;height: 50px;}
.about .pay .qrcodeCode .title span,
.about .pay .wechatCode .title span {color: #000;font-weight: 400;font-size: 22px;}
.about .pay .qrcodeCode .qrcode-img,
.about .pay .wechatCode .qrcode-img {padding: 27px 22px 25px 28px;}
.about .pay .qrcodeCode .qrcode-img img,
.about .pay .wechatCode .qrcode-img img {width: 221px;height: 221px;}
.about .pay .qrcodeCode .qrcode-img span,
.about .pay .wechatCode .qrcode-img span {display: block;font-size: 16px;color: #999;text-align: center;margin-top: 10px;word-break: normal;}
.about .pay .paypal-pay,
.about .pay .bank-pay {display: none;width: 100%;position: absolute;left: 42%;background: #fff;box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.1);z-index: 1;max-width: 450px;top: 875px;}
.about .pay .paypal-pay .bank,
.about .pay .bank-pay .bank {padding: 27px 22px 27px 28px;}
.about .pay .paypal-pay .paypal-title,
.about .pay .bank-pay .paypal-title {display: flex;align-items: center;background: #ECECEC;height: 50px;}
.about .pay .paypal-pay .paypal-title span,
.about .pay .bank-pay .paypal-title span {font-weight: 400;color: #000;font-size: 22px;margin-left: 20px;}
.about .pay .paypal-pay .paypal-payee,
.about .pay .bank-pay .paypal-payee {margin: 20px 0;}
.about .pay .paypal-pay .paypal-information,
.about .pay .bank-pay .paypal-information {border-bottom: 1px solid #999;padding: 20px 0;position: relative;}
.about .pay .paypal-pay .paypal-information:first-child,
.about .pay .bank-pay .paypal-information:first-child {padding-top: 0;}
.about .pay .paypal-pay .paypal-information:last-child,
.about .pay .bank-pay .paypal-information:last-child {border-bottom: none;}
.about .pay .paypal-pay .paypal-bank, .about .pay .paypal-pay .paypal-accounts,
.about .pay .bank-pay .paypal-bank,
.about .pay .bank-pay .paypal-accounts {margin: 15px auto;}
.about .pay .paypal-pay .paypal-payee, .about .pay .paypal-pay .paypal-bank, .about .pay .paypal-pay .paypal-accounts,
.about .pay .bank-pay .paypal-payee,
.about .pay .bank-pay .paypal-bank,
.about .pay .bank-pay .paypal-accounts {color: #000;font-width: 400;font-size: 14px;}
.about .pay .paypal-pay .copyAccounts, .about .pay .paypal-pay .copyBank,
.about .pay .bank-pay .copyAccounts,
.about .pay .bank-pay .copyBank {position: absolute;right: 0;bottom: 30px;background: #00A2E8;border-radius: 8px;width: 66px;height: 33px;border: 0;color: white;}

/* full view */
.full-view {display: none;position: fixed;left: 0;top: 0;width: 100%;height: 100%;background: black;z-index: 999999;}
.full-view:hover .swiper-button-prev,
.full-view:hover .swiper-button-next {display: flex;}
.full-view .swiper-wrapper {height: calc(100% - 70px);margin-top: 50px;}
.full-view .swiper-wrapper img {cursor: pointer;}
.full-view .swiper-pagination {top: 1em;bottom: auto !important;color: #fff;width: 100%;font-size: 16px;}
.full-view .swiper-button-disabled {pointer-events: unset;}
.full-view .swiper-button-prev,
.full-view .swiper-button-next {display: none;width: 32px;height: 32px;background: gray;border-radius: 50%;}
.full-view .swiper-button-prev::after,
.full-view .swiper-button-next::after {content: '';}
.full-view .close-view {top: 10px;right: 10px;position: absolute;z-index: 11;width: 30px;height: 30px;background: url("../../images/icon/i_close.png") center/30px no-repeat;cursor: pointer;}