@media (max-width: 769px) {
   #main .banner {position: relative;}
   #main .banner .bg {width: 100%;height: 220px;}
   #main .banner .titleInfo {color: #FFF;position: absolute;top: 20%;left: 10%;}
   #main .banner .titleInfo span {font-family: "Gotham Bold";display: block;font-size: 20px;}
   #main .banner .titleInfo .ch_name {font-weight: bold;letter-spacing: 2px;}
   #main .banner #topNav {width: 100%;position: absolute;bottom: 0;left: 0;}
   #main .banner #topNav .swiper-slide {width:100px;text-align: center;}
   #main .banner #topNav .swiper-slide .icon {width: 60px;height: 60px;}
   #main .banner #topNav .swiper-slide .name {color: #FFF;font-size: 12px;opacity: 0;margin-top: 8px;}
   #main .banner #topNav .active .name {opacity: 1;}
   #main .navigation {padding: 0 40px 0 20px;}
   #main .navigation .breadcrumb {padding-left: 0;background-color: #FFF;border-bottom: 1px solid rgba(100, 100, 100, .1);border-radius: 0;display: flex;align-items: center;}
   #main .navigation .breadcrumb li:nth-child(1) {margin-right: 8px;}
   #main .navigation .breadcrumb > li + li:before {content: "\e603";font-family: "iconfont";color: rgba(0, 0, 0, .7);padding: 0 5px;}
   #main .navigation .breadcrumb li a {color: #999;font-size: 13px;}
   #main .navigation .breadcrumb li a i {font-size: 17px;color: #000;}
   
   #main .goodsContent {margin: 30px 5%;}
   #main .goodsContent .topInfo div:nth-child(1) .title {font-size: 20px;color: #41210f;font-weight: bold;}
   #main .goodsContent .topInfo div:nth-child(1) .synopsis {color: #01DD62;font-size: 12px;}
   #main .goodsContent .line {width: 100%;height: 3px;display: block;margin-top: 15px;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;}
   #main .goodsContent #goodsImg {height: 300px;padding-bottom: 30px;}
   #main .goodsContent #goodsImg .swiper-slide {text-align: center;}
   #main .goodsContent #goodsImg .swiper-slide img {height: 100%;}
   #main .goodsContent #goodsImg .swiper-pagination {position: absolute;bottom: 4px;}
   #main .goodsContent #goodsImg .swiper-pagination .swiper-pagination-bullet {width: 10px;height: 10px;background-color: initial;border: 1px solid rgba(65, 33, 15, .6);opacity: .6;}
   #main .goodsContent #goodsImg .swiper-pagination .swiper-pagination-bullet-active {border: 1px solid rgba(255, 255, 255, 0);background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#ffffff, #ffffff);background-blend-mode: normal, normal;opacity: 1;}
   #main .goodsContent .parameter {margin-top: 50px;}
   #main .goodsContent .parameter ul li {display: flex;padding: 15px 0;font-size: 12px;border-top: 1px solid rgba(65, 33, 15, .07);}
   #main .goodsContent .parameter ul li:nth-child(1) {border-top: none;}
   #main .goodsContent .parameter ul li .name {width: 30%;color: rgba(65, 33, 15, .7);}
   #main .goodsContent .parameter ul li .txt {width: 70%;line-height: 20px;color: #41210f;}
   #main .action {text-align: center;}
   #main .action a:nth-child(1) {display: inline-block;width: 100px;height: 30px;line-height: 30px;font-size: 12px;border-radius: 30px;color: #FFF;letter-spacing: 1px;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;}
   #main .action a:nth-child(2) {display: inline-block;width: 35px;height: 35px;line-height: 35px;border-radius: 50%;margin-left: 15px;color: #FFF;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;}
}

@media (min-width: 769px) and (max-width: 1100px) {
   #main .banner {position: relative;}
   #main .banner .bg {width: 100%;}
   #main .banner .titleInfo {color: #FFF;position: absolute;top: 20%;left: 10%;}
   #main .banner .titleInfo span {font-family: "Gotham Bold";display: block;}
   #main .banner .titleInfo .en_name {font-weight: bold;font-size: 4.2vw;}
   #main .banner .titleInfo .ch_name {font-size: 3.6vw;letter-spacing: 3px;margin-top: -1vw;}
   #main .banner #topNav {width: 100%;position: absolute;bottom: 40px;left: 0;padding: 0 10%;}
   #main .banner #topNav .swiper-wrapper {justify-content: space-between;}
   #main .banner #topNav .swiper-slide {width:10vw;text-align: center;cursor: pointer;}
   #main .banner #topNav .swiper-slide .icon {width: 8.9vw;}
   #main .banner #topNav .swiper-slide .name {color: #FFF;font-size: 1.6vw;letter-spacing: 2px;opacity: 0;margin-top: 8px;position: relative;}
   #main .banner #topNav .active .name {opacity: 1;}
   #main .banner .breadcrumb {background-color: initial;padding: 0;margin: 0;position: absolute;bottom: 25px;right: 5%;display: flex;align-items: center;}
   #main .banner .breadcrumb > li + li:before {content: "\e603";font-family: "iconfont";color: #FFF;;padding: 0 5px;}
   #main .banner .breadcrumb li a {color: #FFF;}
   #main .banner .breadcrumb li:nth-child(1) a {margin-right: 8px;}
   #main .banner .breadcrumb li a i {font-size: 17px;}

   #main .goodsContent {margin: 30px 5%;}
   #main .goodsContent .topInfo {display: flex;justify-content: space-between;}
   #main .goodsContent .topInfo div:nth-child(1) .title {font-size: 30px;color: #41210f;}
   #main .goodsContent .topInfo div:nth-child(1) .synopsis {color: #01DD62;font-size: 12px;}
   #main .goodsContent .line {width: 100%;height: 3px;display: block;margin-top: 15px;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;}
   #main .goodsContent .content {display: flex;}
   #main .goodsContent #goodsImg {width: 45vw;height: 45vw;margin-top: 15vw;}
   #main .goodsContent #goodsImg .swiper-slide {text-align: center;}
   #main .goodsContent #goodsImg .swiper-slide img {height: 100%;}
   #main .goodsContent #goodsImg .swiper-pagination {width: 20px;position: absolute;top: 45%;left: inherit;}
   #main .goodsContent #goodsImg .swiper-pagination .swiper-pagination-bullet {width: 10px;height: 10px;background-color: initial;border: 1px solid rgba(65, 33, 15, .6);opacity: 1;}
   #main .goodsContent #goodsImg .swiper-pagination .swiper-pagination-bullet-active {border: 1px solid rgba(255, 255, 255, 0);background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#ffffff, #ffffff);background-blend-mode: normal, normal;opacity: 1;}
   #main .goodsContent .parameter {margin-top: 50px;width: 45vw;}
   #main .goodsContent .parameter ul li {display: flex;padding: 15px 0;font-size: 12px;border-top: 1px solid rgba(65, 33, 15, .07);}
   #main .goodsContent .parameter ul li:nth-child(1) {border-top: none;}
   #main .goodsContent .parameter ul li .name {width: 15%;color: rgba(65, 33, 15, .7);}
   #main .goodsContent .parameter ul li .txt {width: 85%;line-height: 20px;color: #41210f;}
   #main .goodsContent .action a:nth-child(1) {display: inline-block;text-align: center;width: 100px;height: 30px;line-height: 30px;font-size: 12px;border-radius: 30px;color: #FFF;letter-spacing: 1px;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;cursor: pointer;}
   #main .goodsContent .action a:nth-child(2) {display: inline-block;text-align: center;width: 35px;height: 35px;line-height: 35px;border-radius: 50%;margin-left: 15px;color: #FFF;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;cursor: pointer;}
}

@media (min-width: 1100px) {
   #main .banner {height: 36.5vw;position: relative;}
   #main .banner .bg {width: 100%;height: 100%;}
   #main .banner .titleInfo {color: #FFF;position: absolute;top: 20%;left: 10%;}
   #main .banner .titleInfo span {font-family: "Gotham Bold";display: block;}
   #main .banner .titleInfo .en_name {font-weight: bold;font-size: 4.2vw;}
   #main .banner .titleInfo .ch_name {font-size: 3.6vw;letter-spacing: 3px;margin-top: -1vw;}
   #main .banner #topNav {width: 100%;position: absolute;bottom: 40px;left: 0;padding: 0 10%;}
   #main .banner #topNav .swiper-wrapper {justify-content: space-between;}
   #main .banner #topNav .swiper-slide {width:10vw;text-align: center;cursor: pointer;}
   #main .banner #topNav .swiper-slide .icon {width: 8.9vw;}
   #main .banner #topNav .swiper-slide .name {color: #FFF;font-size: 1.6vw;letter-spacing: 2px;opacity: 0;margin-top: 8px;position: relative;}
   #main .banner #topNav .active .name {opacity: 1;}
   #main .banner .breadcrumb {background-color: initial;padding: 0;margin: 0;position: absolute;bottom: 25px;right: 5%;display: flex;align-items: center;}
   #main .banner .breadcrumb > li + li:before {content: "\e603";font-family: "iconfont";color: #FFF;;padding: 0 5px;}
   #main .banner .breadcrumb li a {color: #FFF;}
   #main .banner .breadcrumb li:nth-child(1) a {margin-right: 8px;}
   #main .banner .breadcrumb li a i {font-size: 17px;}

   #main .goodsContent {margin: 30px 5%;}
   #main .goodsContent .topInfo {display: flex;justify-content: space-between;}
   #main .goodsContent .topInfo div:nth-child(1) .title {font-size: 30px;color: #41210f;}
   #main .goodsContent .topInfo div:nth-child(1) .synopsis {color: #01DD62;font-size: 12px;}
   #main .goodsContent .line {width: 100%;height: 3px;display: block;margin-top: 15px;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;}
   #main .goodsContent .content {display: flex;}
   #main .goodsContent #goodsImg {width: 45vw;}
   #main .goodsContent #goodsImg .swiper-slide {text-align: center;}
   #main .goodsContent #goodsImg .swiper-slide img {height: 100%;}
   #main .goodsContent #goodsImg .swiper-pagination {width: 20px;position: absolute;top: 45%;left: inherit;}
   #main .goodsContent #goodsImg .swiper-pagination .swiper-pagination-bullet {width: 10px;height: 10px;background-color: initial;border: 1px solid rgba(65, 33, 15, .6);opacity: 1;}
   #main .goodsContent #goodsImg .swiper-pagination .swiper-pagination-bullet-active {border: 1px solid rgba(255, 255, 255, 0);background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#ffffff, #ffffff);background-blend-mode: normal, normal;opacity: 1;}
   #main .goodsContent .parameter {margin-top: 50px;width: 45vw;}
   #main .goodsContent .parameter ul li {display: flex;padding: 15px 0;font-size: 12px;border-top: 1px solid rgba(65, 33, 15, .07);}
   #main .goodsContent .parameter ul li:nth-child(1) {border-top: none;}
   #main .goodsContent .parameter ul li .name {width: 15%;color: rgba(65, 33, 15, .7);}
   #main .goodsContent .parameter ul li .txt {width: 85%;line-height: 20px;color: #41210f;}
   #main .goodsContent .action a:nth-child(1) {display: inline-block;text-align: center;width: 100px;height: 30px;line-height: 30px;font-size: 12px;border-radius: 30px;color: #FFF;letter-spacing: 1px;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;cursor: pointer;}
   #main .goodsContent .action a:nth-child(2) {display: inline-block;text-align: center;width: 35px;height: 35px;line-height: 35px;border-radius: 50%;margin-left: 15px;color: #FFF;background-image: linear-gradient(90deg, #00dc62 0%, #8dd600 100%), linear-gradient(#c5b5bd, #c5b5bd);background-blend-mode: normal, normal;cursor: pointer;}

}