* { font-size: 16px; box-sizing: border-box; padding: 0; margin: 0; text-decoration: none; } body::-webkit-scrollbar{ width:0; } body{ min-height: calc(100vh - 131px); position: relative; } /* 澶撮儴鏍峰紡 */ .header { width: 100%; height: 81px; background: white; position: fixed; top: 0; left: 0; border-bottom: 1px solid #eeeeee; z-index: 99999; } .navbar-brand { height: 100%; padding: 0; } .headerBox { width: 1170px; margin: auto; display: flex; align-items: center; justify-content: space-between; height: 81px; } /* 瀵艰埅鏍忔牱寮 */ .home_nav { height: 50px; background: white; width: 100%; position: fixed; top: 81px; left: 0; box-shadow: 1px 1px 5px #cccccc; z-index: 99; } .home_nav ul { display: flex; width: 1170px; margin: 0 auto; line-height: 50px; list-style: none; justify-content: space-between; font-size: 15px; padding: 0; } .home_nav ul li { height: 50px; color: #666666; padding: 0 5px; cursor: pointer; } /* 涓嬪垝绾挎牱寮 */ .home_nav .line { width: calc(100% + 8px); height: 6px; margin-top: -6px; border-radius: 3px; margin-left: -4px; } /* 閫変腑涓嬪垝绾跨殑鏍峰紡 */ .active .line { background: #FF8987; color: #FF8987; } .home_nav a:hover { text-decoration: none; } /* banner鏍峰紡 */ .banner, .sub-banner { width: 100%; margin-top: 131px; position: relative; } .banner { height: 589px; } .sub-banner { height: 258px; } .banner .bg0 { height: 100%; background: #fff url("../img/home_banner.png") repeat; background-position: center center; } .sub-banner .bg { height: 100%; background: #fff url("../img/sub_banner/banner1.png") repeat; background-position: center center; } .sub-banner .bg2 { background: #fff url("../img/sub_banner/banner2.png") repeat; background-position: center center; } .sub-banner .bg3 { background: #fff url("../img/sub_banner/banner3.png") repeat; background-position: center center; } .sub-banner .bg4 { background: #fff url("../img/sub_banner/banner4.png") repeat; background-position: center center; } .sub-banner .bg5 { background: #fff url("../img/sub_banner/banner5.png") repeat; background-position: center center; } .sub-banner .bg6 { background: #fff url("../img/sub_banner/banner6.png") repeat; background-position: center center; } .sub-banner .bg7 { background: #fff url("../img/sub_banner/banner7.png") repeat; background-position: center center; } .sub-banner .bg8 { background: #fff url("../img/sub_banner/banner8.png") repeat; background-position: center center; } .sub-banner .bg9 { background: #fff url("../img/sub_banner/banner9.png") repeat; background-position: center center; } .sub-banner .bg10 { background: #fff url("../img/sub_banner/banner10.png") repeat; background-position: center center; } .sub-banner .bg11 { background: #fff url("../img/sub_banner/banner11.png") repeat; background-position: center center; } .sub-banner .bg10_1 { background: #fff url("../img/sub_banner/banner10_1.png") repeat; background-position: center center; } /* 鍏徃浠嬬粛 */ .introduce { margin: 36px auto 67px auto; width: 1166px; } .introduce .con { font-size: 16px; color: #666666; line-height: 27px; margin-bottom: 29px; margin-top: 29px; } .introduce .con p { margin-bottom: 35px; } .introduce .title, .products .title { color: #FF8987; font-size: 28px; line-height: 22px; font-weight: bold; text-align: center; } .introduce .eng, .products .eng { font-size: 16px; line-height: 22px; color: #D0D0D0; text-align: center; } /* 鎴戜滑鐨勪骇鍝 */ .products { width: 1300px; margin: 0 auto 100px auto; } .products .con { display: flex; align-items: center; flex-wrap: nowrap; } .imgLeft, .imgRight { display: inline-block; width: 15.6px; height: 26.2px; background: #fff url("../img/home_gey.png") repeat; cursor: pointer; } .imgLeft:hover, .imgRight:hover, .imgLeft:active, .imgRight:active { background: #fff url("../img/home_pink.png") repeat; } .imgRight { transform: scaleX(-1); } .products .imgBox { width: 1260px; display: flex; justify-content: space-between; align-items: center; overflow: hidden; margin: 0 38px; } .products .icon { width: 161px; height: 161px; margin: 36px 0 22px 0; margin: 36px auto 22px auto; display: block; } .products .text { font-size: 16px; color: #666666; text-align: center; margin: 0; } /*搴曢儴banner*/ .footer { width: 100%; position: absolute; bottom: 0; background: #262E3B; } footer[data-index='6'], footer[data-index='7'], footer[data-index='8'] { position: fixed; width: 100%; bottom: 0; } .border-bg { width: 100%; height: 4px; background: #fff url("../img/border.png") repeat; } .copyright { padding: 25px 0 20px 0; text-align: center; font-size: 14px; color: #999; } .cr-link { overflow: hidden; height: 28px; line-height: 28px; margin: 0; color: #999; } .cr-link span { display: inline-block; width: 104px; height: 14px; line-height: 1; border-right: 1px solid rgba(153, 153, 153, 0.2); } .cr-link span:last-child { border-right: none; } .cr-link span a { color: #999; } .cr-link span a:hover { text-decoration: none; } .about-title { font-size: 24px; font-weight: bold; color: #FF8589; line-height: 27px; margin-bottom: 13px; margin-top: 40px; } .lead { font-size: 16px; font-weight: 400; color: #666666; line-height: 27px; margin-bottom: 0; } .app-introduce { width: 1170px; padding: 40px 0 100px 0; margin: 0 auto; overflow: hidden; } .video-introduce { padding: 40px 0 60px 0; } .tag-wrapper { position: absolute; top: 72px; left: 50%; margin-left: -415px; padding: 17px; width: 385px; height: 90px; background: rgba(0, 0, 0, 0.3); border-radius: 10px; color: #fff; font-size: 16px; font-weight: 400; } .main { font-size: 28px; font-weight: bold; height: 28px; line-height: 28px; overflow: hidden; } .sub-main { font-size: 16px; font-weight: 400; margin-left: 9px; } .score { float: right; } .start { display: inline-block; width: 16px; height: 16px; background-image: url("../img/start.png"); background-size: 100% 100%; } .description { line-height: 36px; font-weight: 400; } .hide { display: none; } .video_box { float: left; width: 213px; height: 182px; background: #fff; border: 1px solid #efefef; border-radius: 16px; margin: 0 10px 20px 10px; margin-bottom: 15px; } .video_box_img { width: 200px; height: 129px; border-radius: 10px; background-color: #fff; margin: 5.5px auto; background-size: 100% 100% !important; background-repeat: no-repeat !important; } .video_box_text { font-size: 16px; font-weight: 400; color: #333333; line-height: 28px; margin: 10px 0 0 20px; } .video_box_play { display: none; margin: 38px 0 0 75px; } .video_box:hover { text-decoration: none; } .video_box:hover .video_box_play { display: inline; } .large_video .video_box { margin: 0 7px 15px 7px; width: 277px; height: 203px; } .large_video .video_box_img { width: 261px; height: 149px; margin-top: 0; } .large_video .video_box_text { margin: 10px 0 0 10px; } .large_video .video_box_play { margin: 51px 0 0 105px; } .control-icon { position: absolute; top: 0; bottom: 0; margin: auto; left: 115px; opacity: .5; } .control-icon:active { opacity: .6; } .control-icon:hover { opacity: .6; } .control-icon.left { transform: scale(-1); } /* 淇濊瘉灏忓睆骞曚笅鍥剧墖鍙互鏄剧ず涓棿閮ㄥ垎 */ #myCarousel { margin-top: 80px; } #myCarousel .carousel-inner { overflow: hidden; width: 100%; height: 589px; } .carousel-inner .item { width: 100%; height: 100%; } .slider-img { display: block; width: 100%; height: 100%; } .carousel-indicators li { margin: 0; width: 12px; height: 12px; border-radius: 50%; border: none; background: #6a6a6a; } .carousel-indicators .active { background: #ff6a5a; border-radius: 50%; } .carousel-control.left, .carousel-control.right { background-image: none !important; } /* 鎴戜滑鐨勪骇鍝 */ .product-container { width: 1200px; } .product-wrapper { padding: 0 !important; } .product-wrapper .product_item{ cursor: pointer; transition: all 0.5s; } .product-wrapper .product_item:hover { transform: scale(1.05); } .product-wrapper .carousel-inner { height: 250px; } .multi-item-carousel .carousel-inner > .item { -webkit-transition: 500ms ease-in-out left; transition: 500ms ease-in-out left; } .multi-item-carousel .carousel-inner .active.left { left: -16.6%; } .multi-item-carousel .carousel-inner .active.right { left: 16.6%; } .multi-item-carousel .carousel-inner .next { left: 16.6%; } .multi-item-carousel .carousel-inner .prev { left: -16.6%; } @media all and (transform-3d), (-webkit-transform-3d) { .multi-item-carousel .carousel-inner > .item { -webkit-transition: 500ms ease-in-out left; transition: 500ms ease-in-out left; -webkit-transition: 500ms ease-in-out all; transition: 500ms ease-in-out all; -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-transform: none!important; transform: none!important; } } .multi-item-carousel .carouse-control.left, .multi-item-carousel .carouse-control.right { background-image: none; } #theCarousel { display: flex; align-items: center; flex-wrap: nowrap; } #theCarousel .col-xs-2 { width: 20% !important; } .usbk-entry { color: #636679; font-size: 16px; line-height: 22px; font-weight: bold; text-align: center; cursor: pointer; margin: 0; } /* .usbk-entry:hover { text-decoration: none; color: #636679; } */