@charset "UTF-8"; @font-face { font-family: "webfontB"; src: url(../plugin/webfonts/Alibaba-PuHuiTi-Bold.otf); } @font-face { font-family: "webfontR"; src: url(../plugin/webfonts/Alibaba-PuHuiTi-Regular.otf); } @font-face { font-family: "webfontM"; src: url(../plugin/webfonts/Alibaba-PuHuiTi-Medium.otf); } body { background: #313131; position: relative; font-family:"思源黑体", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif, ; } a { text-decoration: none; } a:hover { text-decoration: none; } .header { width: 100%; color: #fff; } .KN_PCHD { } .header-box { width: 91%; margin: 0 auto; padding:36px 0 20px 0; overflow: hidden; height: 106px; background: #313131; } .header-logo { width: 15%; } .header-nav { width: 57%; } .header-nav a { // width: calc((100% - 3%)/8); height: 40px; line-height: 40px; color: #b2b2b2; display: inline-block; margin-right: 2%; font-size: 1rem; border-radius: 3px; margin-right: 0; // padding: 0 1.9%; // margin: 0 0.38%; width: 10.7%; text-align: center; float: left; margin:0 0.2%; } .header-nav a:hover { color: #fefefe; background: #e60012; } .header-nav .header-active { color: #fefefe; background: #e60012; } .header-r { width: 9.2%; height: 40px; position: relative; width: 200px; margin-left: 4%; } .header-shop { width: 63%; height: 40px; line-height: 40px; border-radius:20px; color: #f6f7f7; font-size: 0.875rem; text-align: center; background: url(../img/sakura-icon18.jpg) repeat 10% center #e60012; } .header-shop a, .header-shop a:hover{ color: #f6f7f7; } .headerSearch { height: 100%; width: 30%; position: absolute; right: 0; top: 0; color: #fff; border-radius: 20px; background: #8c8888; width: 40px; height: 40px; } .headerSearch .headerSearchIMG { line-height: 35px; } .headerSearch.active { width: 100%; animation: headerSearch_animate .13s ease-in-out; -webkit-animation: headerSearch_animate .13s ease-in-out; position: absolute; right: 0; top: 0; } @keyframes headerSearch_animate { 0% { width: auto; } } .headerSearchInput { display: block; width: 100%; height: 100%; background-color: transparent; text-indent: 10px; color: #fff; width: 85%; } .headerSearchIMG { position: absolute; top: 0; right:10px; } .headerSearchIMG:hover { opacity: .8; } @media(max-width:1920px) { @media(max-height:975px) { } } @media(max-width:1680px) { } @media(max-width:1440px) {} @media(max-width:1360px) {} @media(max-width:1280px) { } @media(max-width:1152px) { .header-logo { margin-top: 6px; } .header-nav { width: 60%; } .header-r { margin-left: 2%; width: 180px; } .header-shop { width: 70%; } } @media(max-width:1024px) { .KN_APPHD { height: 60px; } .KN_APPHD .KN_APPHDMENUBAR { line-height: 55px; } .KN_APPHD .KN_APPHDNAV{ background: #fff; } .KN_APPHD .KN_APPHDNAV a{ height: 40px; line-height: 40px; display: block; text-align: center; color: #000; border-top: 1px solid #000; } .KN_APPHD .KN_APPHDNAV .header-active{ color: #fefefe; background: #e60012; } } @media(max-width:480px) { } @media(max-width:414px) { .KN_APPHDLOGOIMG{ padding: 12px 0; } } @media(max-width:375px) { } /* home*/ .swiper-container .swiper-button-prev { background: url(../img/sakura-icon45.png) no-repeat 4.5% center ; height: 23px; width: 78px; } .swiper-container .swiper-button-next{ background: url(../img/sakura-icon46.png) no-repeat 4.5% center ; height: 23px; width: 78px; } .swiper-container .swiper-button-prev:hover { background: url(../img/sakura-icon20.png) no-repeat 4.5% center ; height: 23px; width: 78px; } .swiper-container .swiper-button-next:hover{ background: url(../img/sakura-icon21.png) no-repeat 4.5% center ; height: 23px; width: 78px; } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { width: 100px; height: 4px; background-clip: #9b9b9c; border-radius: 0px; opacity: 1; margin: 0 10px; } .swiper-pagination-bullet { background: #9b9b9c; opacity: 1; } .swiper-pagination-bullet-active { background: #e60012; } .swiper-container-horizontal>.swiper-pagination-bullets { bottom: 5%; } .swiper-container .swiper-slide .swiper-slide-a { width: 190px; height: 60px; line-height: 60px; position: absolute; left: 16%; top: 60%; background: #fff; color: #666666; font-size: 1.25rem; text-align: center; display: inline-block; border-radius: 5px; } .swiper-container .swiper-slide .swiper-slide-a:hover { background: #e60012; color: #fff; } .swiper-container .swiper-slide .swiper-slide-video { width: 100%; height: 800px; } .content { width: 100%; color: #fff; padding-top: 48px; background: url(../img/askura-bg.jpg) no-repeat top center ; background-size: cover; } .content-home { width: 63%; margin: 0 auto; } .home-pro { overflow: hidden; } .home-pro2 { overflow: hidden; width: 91%; margin: 0px auto 56px auto; } .home-pro2 .home-pro2-img{ // width: 16.5%; float: left; color: #fff; width: calc((100% - 1%*6)/6); margin: 0 0.5%; } .home-pro2 .home-pro2-img span, .home-pro2 .home-pro2-img a{ display: inline-block; float: left; margin-right: 15px; } .home-pro2 .home-pro2-img:hover{ left:0px; border-right:0px solid transparent; -webkit-filter:drop-shadow(0px 0 0px #e60012); -moz-filter:drop-shadow(0px 0 0px #e60012); -ms-filter:drop-shadow(0px 0 0px #e60012); -o-filter:drop-shadow(0px 0 0px #e60012); filter:drop-shadow(100% #e60012); color: #fff; opacity: 1; left:0px; color: #0085ff; } .home-pro2 .home-pro2-img p{ margin-top: 20%; color: #8e8e8e; line-height: 28px; } .home-pro .home-pro01 { float: left; width: 23.5%; } .home-pro .home-pro02 { width: 29%; } .home-pro { display: flex; width: 100%; padding:0; box-sizing: border-box; height: 60vh; height: auto; } .home-pro-img { flex: 1; overflow: hidden; transition: .5s; margin: 0 ; box-shadow: 0 20px 30px rgba(0, 0, 0, 0.1); line-height: 0; } .home-pro-img > img { width: 100%; // height: calc(100% - 10vh); // -o-object-fit: cover; // object-fit: cover; transition: .5s; height: 60vh; height: auto; } .home-pro-img:hover { flex: 1 1 5%; } .home-pro-img:hover > img { width: 100%; height: 100%; } .home-us { padding: 83px 0 0 0; } .home-us-box { overflow: hidden; } .home-us-img { float: left; width: 58%; } .home-us-r { float: left; width: 42%; text-align: center; font-size: 1rem; line-height: 30px; } .home-us-r h2 { font-size: 2.125rem; margin-top: 12%; } .home-us-r .home-us-t { font-size: 1.125rem; padding: 5% 0 10% 0; } .home-us-r .home-us-a { width: 135px; height: 36px; line-height: 36px; text-align: center; border-radius: 18px; border: 1px solid #b60d1a; color: #e60012; font-size: 1rem; display: block; margin: 10% auto 0 auto; } .home-us-box2 { font-size: 2.125rem; text-align: center; padding: 100px 0 65px 0; color: #dadada; } .home-us-box3 { overflow: hidden; margin-bottom: 110px; } .home-us-box3 li { float: left; width: 33.33%; padding: 0 5.3%; text-align: center; font-size: 0.875rem; color: #b2b2b2; } .home-us-box3 li div { font-size: 2.125rem; color: #c18956; } .home-us-box3 li div img { margin: 0 12px 7px 0; } .home-news-l { float: left; width: 43%; } .home-news-l .home-news-t { padding:18px 20px 12px 20px; color: #c9c9c9; font-size: 1.1375rem; background: #404040; } .home-news-l .home-news-t h4{ font-size: 1.1375rem; margin-bottom: 34px; } .home-news-l .home-news-time { background: url(../img/sakura-icon19.png) no-repeat left center ; padding-left: 16px; font-size: 0.85rem; } .home-news-r { width: 55%; float: right; } .home-news-r li { overflow: hidden; background: #404040; margin-bottom: 15px; margin-right: 25px; } .home-news-d { padding: 4% 5%; width: 60%; float: left; color: #b7b7b7; } .home-news-d .home-news-time2 { background: url(../img/sakura-icon19.png) no-repeat left center ; padding-left: 16px; font-size: 0.85rem; margin-top: 28px; } .home-news-img2 { width: 39%; float: left; } .home-news-a { width: 100%; clear:both; padding:75px 0 80px 0; } .home-news-a a{ display:block; width: 155px; height: 38px; line-height: 38px; text-align: center; color: #e60012; border-radius: 15px; border: 1px solid #911620; margin: 0 auto; font-size: 0.938rem; } .home-ty { overflow: hidden; } .home-ty h1{ font-size: 2.13rem; color: #dadada; text-align: center; margin-bottom: 40px; } .home-ty-ul li { float: left; width: 33%; border-left: 1px solid #eeeeee; text-align: center; padding-top: 26px; height: 270px; } .home-ty-ul li:nth-child(1){ border-left: 0px solid #eeeeee; } .home-ty-ul li .home-ty-div { font-size: 1.125rem; padding: 22px 0 10px 0; } .home-ty-ul li .home-ty-div2 { font-size: 0.9rem; color: #c9c9c9; } .home-ty-ul li .home-ty-input { width: 55%; margin: 0 auto; background: #444444; font-size: 0.9rem; height: 42px; margin-top: 45px; text-indent: 10px; color: #fff; border-radius: 7px; } .home-ty-ul li .home-ty-a { width: 55%; margin: 0 auto; background: #444444; font-size: 0.9rem; height: 42px; margin-top: 45px; text-indent: 10px; color: #e6e6e6; display: inline-block; line-height: 40px; border-radius: 7px; } .home-ty-ul .home-ty-li { background: url(../img/sakura-icon13.png) no-repeat center bottom; } .home-news-r { overflow-y: auto; overflow-y: scroll; height: 445px; } @-webkit-keyframes rowup { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { -webkit-transform: translate3d(0, -312px, 0); transform: translate3d(0, -312px, 0); } } @keyframes rowup { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { -webkit-transform: translate3d(0, -312px, 0); transform: translate3d(0, -312px, 0); } } .rowup{ -webkit-animation: 10s rowup linear infinite normal; animation: 10s rowup linear infinite normal; position: relative; } /*list*/ .content-list { width: 100%; background: #22252b; font-size: 0.875rem; color: #e0e1e1; padding-top: 88px; padding-bottom: 153px; position: relative; background: url(../img/list-bg.png) no-repeat center bottom #22252b; background-size: contain; } .content-list-box { width: 83.5%; background: #333538; margin: 0 auto; padding: 65px 5%; line-height: 30px; background: url(../img/sakura_bg02.png) no-repeat top center; background-size: cover; } .about-nav { width: 83.5%; overflow: hidden; margin: 0 auto; margin-bottom: 20px; } .about-nav a { width: 20%; float: left; height: 80px; line-height: 80px; background: #191a1c; text-align: center; border: 1px solid #4e5155; color: #eeeeee; font-size: 1rem; } .about-nav a:hover { background: #00509a; } .about-nav .about-nav-active { background: #00509a; } .about-us section{ line-height: 30px; padding-bottom: 17px; } .about-us .about-img { text-align: center; padding-top: 15px; } .about-idea{ color: #e0e1e1; } .about-idea .about-idea-t{ overflow: hidden; } .about-idea .about-idea-l { width: 48%; line-height: 30px; } .about-idea .about-idea-l h2 { font-size: 2.125rem; color: #fff; } .about-idea .about-idea-l h3 { font-size: 1.25rem; color: #fff; margin: 60px 0 15px 0; } .about-idea-img { width: 46%; } .about-idea-b { border-top: 1px solid #5c5d60; overflow: hidden; clear: both; margin-top: 110px; } .about-idea-b h1{ font-size: 2.125rem; padding:80px 0 60px 0; } .about-idea-b .about-idea-ys { width: 30%; margin-left: 5%; float: left; line-height: 30px; } .about-idea-b .about-idea-ys:nth-child(2){ margin-left: 0; } .about-idea-b .about-idea-ys h3 { font-size: 1.25rem; margin-bottom: 30px; } .about-culture { color: #e0e1e1; } .about-culture h1 { font-size: 2.125rem; margin-bottom: 30px; } .about-culture-box { overflow: hidden; } .about-culture-box2 { margin-bottom: 85px; } .about-culture-box .about-culture-l { width: 46%; } .about-culture-box .about-culture-t { font-size: 1.5rem; color: #0085ff; padding:20px 0; } .about-culture-box .about-culture-t span { color: #595b5d; padding:0 10px; } .about-culture-box .about-culture-img { width: 46%; } .about-honor { overflow: hidden; padding: 65px 2.5%; } .about-honor h1 { font-size: 2.125rem; text-indent: 1.6%; padding-bottom: 45px; } .about-honor ul li{ width: 21.7%; float: left; margin: 0 1.3%; margin-bottom: 40px; background: #fff; } .about-honor ul li .honor-img { height: 460px; } .about-honor ul li .honor-con { font-size: 1rem; background: #00509a; padding:6% 7%; line-height: 28px; height: 130px; } .about-honor ul li .honor-con .honor-titme{ font-size: 0.875rem; padding-bottom: 7px; } .about-equipment { padding: 65px 4.25%; } .about-equipment-nav { width: 30%; margin: 0 auto; padding-bottom: 65px; } .about-equipment-nav a { font-size: 2.125rem; color: #fff; text-align: center; display: inline-block; margin: 0 7%; } .about-equipment-nav a:hover { color: #0085ff; border-bottom: 4px solid #0085ff; padding-bottom: 10px; } .about-equipment-nav .equipment-nav-active { color: #0085ff; border-bottom: 4px solid #0085ff; padding-bottom: 10px; } .about-equipment-ul { overflow: hidden; } .about-equipment-ul li{ margin:0 0.9%; width: 48%; float: left; height: 432px; margin-bottom: 30px; } .about-equipment-box li { overflow: hidden; margin-bottom: 30px; } .about-equipment-box .about-equipment-li { } .about-equipment-box .about-equipment-li .about-equipment-div { margin-left: 1.7%; width: 49%; float: left; } .about-equipment-box .about-equipment-li .about-equipment-div02 { float: left; width: 23.6%; margin-left: 1.7%; } .about-equipment-box .about-equipment-li .about-equipment-div03 { float: left; width: 49%; margin-left: 1.7%; } .about-equipment-box .about-equipment-li .about-equipment-div04 { float: left; width: 18.5%; margin-left: 1.7%; } .about-equipment-box .about-equipment-li .about-equipment-div:nth-child(1), .about-equipment-box .about-equipment-li .about-equipment-div02:nth-child(1), .about-equipment-box .about-equipment-li .about-equipment-div04:nth-child(1){ margin-left: 0; } .content-list-news { width: 86%; margin: 0 auto; overflow: hidden; } .content-list-news ul li { float: left; width: 48%; color: #eeeeee; background: #303030; margin: 0 0.6%; margin-bottom: 20px; } .content-list-news .news-img { width: 49%; float: left; } .content-list-news .news-con { font-size: 0.875rem; width: 51%; float: left; padding: 2% 3%; } .content-list-news .news-con-title { font-size: 1.25rem; } .content-list-news .news-con section { line-height: 28px; padding: 10px 0 20px 0; } .content-list-news .news-con-time { color: #a12424; } .news-more { clear: both; display: block; margin: 0 auto; width: 80px; color: #dfdedf; font-size: 1.125rem; text-align: center; padding-top: 45px; } .news-more span { padding-bottom: 20px; display: block; } .news-detailed { width: 100%; } .news-detailed-top{ background: #2b2c2d; color: #999; padding: 0 4.5%; line-height: 30px; } .news-detailed .news-detailed-n{ color: #ababab; font-size: 1.125rem; padding: 60px 0 40px 0; border-bottom: 1px solid #555657; } .news-detailed .news-detailed-n span{ color: #fff; } .news-detailed-box { padding: 0 17.5%; } .news-detailed .news-detailed-title { font-size: 2rem; color: #fff; padding: 90px 0 30px 0; } .news-detailed .news-detailed-time { color: #bd1f1f; padding-bottom: 36px; } .news-detailed-box section { padding-bottom: 30px; } .news-detailed-box p { margin-bottom: 55px; text-align: center; } .news-detailed-box h3 { font-size: 1.125rem; padding-bottom: 8px; color: #fff; } .news-detailed-a { padding: 100px 0; } .news-detailed-a a{ background: #fff; font-size: 1rem; color: #e60012; text-align: center; width: 32%; margin: 0 0.5%; display: inline-block; line-height: 80px; } .news-detailed-bottom { background: #111111; padding: 70px 4.5%; overflow: hidden; } .news-detailed-bottom h1{ font-size: 1.875rem; color: #fff; text-align: center; padding-bottom: 30px; } .news-detailed-bottom ul { overflow: hidden; } .news-detailed-bottom ul li{ margin-left: 1.3%; width: 48%; background: #fff; overflow: hidden; float: left; } .news-detailed-bottom ul li:nth-child(0){ margin-left: 0; } .news-detailed-bottom ul li .news-detailed-bottom-img { width: 47%; } .news-detailed-bottom ul li .news-detailed-bottom-con{ width: 53%; padding: 5% 8%; color: #666666; } .news-detailed-bottom ul li .news-detailed-bottom-con h3{ font-size: 1.25rem; padding-bottom: 20px; color: #313131; } .news-detailed-bottom-con .news-detailed-bottom-time { color: #bd1f1f; padding-top: 30px; } .news-detailed-bottom .news-detailed-a2 { text-align: center; padding-top: 60px; } .news-detailed-bottom .news-detailed-a2 a{ font-size: 1rem; color: #fff; clear: both; } .product-nav { width: 50%; } .product-nav a { width: 33.33%; } .product-con { border-top: 1px solid #393b41; border-bottom: 1px solid #393b41; width: 85%; margin: 70px auto 20px auto; padding:20px 0 12px 0; } .product-con .home-pro2-img:hover{ left:0px; border-right:0px solid transparent; -webkit-filter:drop-shadow(0px 0 0px #0085ff); -moz-filter:drop-shadow(0px 0 0px #0085ff); -ms-filter:drop-shadow(0px 0 0px #0085ff); -o-filter:drop-shadow(0px 0 0px #0085ff); filter:drop-shadow(100% #0085ff); color: #0085ff; opacity: 2; left:0px; } .content-list-product { width: 85%; margin: 0 auto; overflow: hidden; } .content-list-product .product-img a { width: 32%; float: left; margin: 0 0.66%; margin-bottom: 20px; display: inline-block; } .list-page { clear: both; width: 600px; margin: 0 auto; padding-top: 60px; } .list-page a{ width: 50px; height: 50px; line-height: 50px; color: #fff; font-size: 1.375rem; display: inline-block; background: #37383a; border-radius: 3px; text-align: center; margin: 0 4px; } .list-page .page-a { width: 120px; } .list-page .page-active{ background: #0370e4; color: #fff; } .list-page a:hover{ background: #0370e4; color: #fff; } .list-page span { display: inline-block; margin: 0 7px; } .product-detailed-box { background: #2b2c2d; color: #999; padding: 0 4.5%; line-height: 30px; padding-bottom: 140px; } .product-detailed-nav { text-align: center; font-size: 1.375rem; color: #959596; padding: 50px 0; } .product-detailed-nav a{ color: #959596; padding:0 20px; } .product-detailed-nav a:hover{ color: #fff; font-size: 2rem; } .product-detailed-nav .detailed-active { color: #fff; font-size: 2rem; } .product-detailed-c section{ text-align: center; } .product-detailed-box2 { overflow: hidden; background: #37383a; font-size: 1.375rem; color: #fff; } .product-detailed-div { float: left; width: 50%; } .product-detailed-div ul li { overflow: hidden; border-top: 1px solid #5f6061; height: 75px; line-height: 25px; padding: 25px 0; } .product-detailed-div ul li:nth-child(1) { border-top:0px solid #5f6061; } .product-detailed-div ul li span { color: #ababab; text-align: right; width: 22%; display: inline-block; float: left; padding-left: 3%; } .product-detailed-div ul li section { padding-left: 25%; padding-right: 10%; } .case-ul li .case-title{ font-size: 1.375rem; background: #fff; padding: 30px 6%; color: #333333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .case-ul li .case-title span{ background: #0075c1; color: #fff; font-size: 0.875rem; padding: 5px 8px; margin-right: 10px; } .list-page2 { width: 880px; } .list-page2 a{ background: #fff; color: #666666; } .case-banner { position: relative; } .case-search { width: 35%; height: 80px; background: #fff; position: absolute; left: 32%; bottom: -40px; z-index: 9; } .case-search .case-icon { width: 13%; background: url(../img/sakura-icon23.png) no-repeat center; border-right: 1px solid #e1e1e1; height: 80px; float: left; } .case-search .case-input { width: 64%;height: 80px; float: left; color: #666666; font-size: 1.125rem; text-indent: 5px; } .case-search .case-cx { font-size: 1.375rem; color: #fff; background: #00509a; text-align: center; line-height: 80px; width: 23%; display: inline-block; } .service-nav { width: 50%; } .service-nav a { width: 33.33%; } .gallery-top { height: 75%; width: 100%; background: url(../img/askura-list25.jpg) no-repeat center ; background-size: cover; } .gallery-top .swiper-slide { height: 850px; position: relative; } .gallery-top .swiper-slide .swiper-slide-img{ width: 76px; position: absolute; top: 36%; left: 62%; } .gallery-thumbs { height: 25%; box-sizing: border-box; padding: 10px 5%; } .gallery-thumbs .swiper-slide { height: 100%; border: 6px solid #999999; background: url(../img/askura-list85.png) no-repeat center ; background-size: cover; text-align: center; } .gallery-thumbs .swiper-slide .swiper-slide-img { padding-top: 2%; } .gallery-thumbs .swiper-slide-thumb-active { border: 6px solid #00509a; } .gallery-thumbs { } .gallery-thumbs .swiper-button-prev { background: url(../img/sakura-icon24.png) no-repeat center #191a1c; width: 4.4%; height: 93%; left: -1px; top: 31px; } .gallery-thumbs .swiper-button-next{ background: url(../img/sakura-icon25.png) no-repeat center #191a1c; width: 4.4%; height: 93%; right: -1px; top: 31px; } .gallery-thumbs .swiper-button-prev:hover { background: url(../img/sakura-icon24.png) no-repeat center #191a1c; width: 4.4%; height: 93%; left: -1px; top: 31px; } .gallery-thumbs .swiper-button-next:hover{ background: url(../img/sakura-icon25.png) no-repeat center #191a1c; width: 4.4%; height: 93%; right: -1px; top: 31px; } .serivce-after { font-size: 1.125rem; color: #fff; } .serivce-after section b{ font-size: 1.375rem; color: #0085ff; } .serivce-after-box { overflow: hidden; border-top: 1px solid #5c5d60; border-bottom: 1px solid #5c5d60; margin-top: 55px; padding: 60px 0 70px 0; } .serivce-after-box .serivce-after-div { width: 33.33%; font-size: 1rem; overflow: hidden; float: left; padding-right: 15px; } .serivce-after-img { width: 12%; margin-right: 5%; } .serivce-after-con h2{ font-size: 1.375rem; } .serivce-after p { text-align: center; } .join-shop-box{ background: #333538; margin: 0 0.8%; margin-right: 1.6%; margin-bottom: 30px; overflow: hidden; padding: 15px 2.5%; } .join-shop-jg { height: 80px; line-height: 80px; font-size: 1.875rem; color: #bbbbbb; } .join-shop-jg b { font-size: 3rem; color: #fff; } .join-shop-search { position: initial; width: 40%; } .join-shop-ul { overflow: hidden; } .join-shop-ul li{ float: left; background: #333538; width: 31.5%; font-size: 1rem; color: #bbbbbb; line-height: 30px; margin: 0 0.8%; padding: 40px 3% 50px 3%; margin-bottom: 20px; } .join-shop-ul li h3 { font-size: 1.375rem; color: #fff; } .join-shop-ul li .join-shop-div { border-top: 1px solid #4e5052; border-bottom: 1px solid #4e5052; padding: 20px 0; margin-top: 20px; } .join-shop-cs { background-color: #333538; padding: 60px 3.7%; } .join-shop-cs li { width: 100%; overflow: hidden; } .join-shop-cs li .join-shop-cs-l{ float: left; font-size: 1.625rem; margin-right: 2%; padding-bottom: 25px; padding-top: 3px; } .join-shop-cs li .join-shop-cs-r { float: left; width: 95%; line-height: 35px; } .join-shop-cs li .join-shop-cs-r a{ margin:0 1.4%; font-size: 1.125rem; color: #fffefe; } .shop-search { width: 100%; } .shop-search-nav { border-bottom: 1px solid #65676b; margin: 0px 0.8%; margin-bottom: 60px; } .shop-search-nav a{ width: 120px; color: #919295; font-size: 1.875rem; line-height: 90px; display: inline-block; text-align: center; } .shop-search-nav .shop-search-this { color: #0085ff; border-bottom: 5px solid #0085ff; } .shop-search-nav a:hover { color: #0085ff; border-bottom: 5px solid #0085ff; } .join-shop-jg2 { font-size: 1.625rem; } .join-shop-jg2 b { font-size: 2rem; } .research { overflow: hidden; padding: 80px 2.5%; } .research ul li { color: #fefdfb; font-size: 1rem; width: 45%; margin: 0 2.5%; float: left; margin-bottom: 80px; } .research ul li .research-li-title { font-size: 2rem; color: #fff; padding: 40px 0 20px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .research ul li .research-li-com section { line-height: 35px; height: 85px; padding: 0; font-size: 1rem; } .list-join { width: 83.5%; margin: 0 auto; padding: 65px 0; } .join-nav { width: 33.3%; overflow: hidden; margin: 0 auto; margin-bottom: 20px; position: absolute; top: -40px; left: 33.33%; } .join-nav a{ width: 50%; float: left; height: 80px; line-height: 80px; background: #191a1c; text-align: center; border: 1px solid #4e5155; color: #eeeeee; font-size: 1rem; } .join-nav .about-nav-active { background: #00509a; } .join-title { color: #0085ff; overflow: hidden; margin-bottom: 46px; } .join-title .join-n { font-size: 5rem; float: left; line-height: 80px; margin-right: 30px; } .join-title .join-con p { font-size: 2.25rem; } .join-title .join-con section { font-size: 1.375rem; color: #65676a; } .join-ul { overflow: hidden; margin-bottom: 45px; } .join-ul li { width: 48%; float: left; background: #333538; margin: 0 0.8%; margin-bottom: 20px; } .join-box-l { font-size: ; color:#bbbbbb; font-size: 0.875rem; float: left; width: 82%; padding: 35px 5%; line-height: 30px; border-right: 1px solid #5c5d60; } .join-box-title { font-size: 1.375rem; color: #fff; padding-bottom: 20px; } .join-box-img { width: 18%; text-align: center; padding: 7% 0; } .join-box-l section{ height: 60px; } .join-ul2 { overflow: hidden; margin-bottom: 65px; } .join-ul2 li { width: 31.5%; float: left; background: #333538; text-align: center; font-size: 0.875rem; color: #bbbbbb; line-height: 30px; padding:2.1% 0; margin: 0 0.8%; } .join-ul2 li h2 { font-size: 1.375rem; font-weight: bold; color: #fff; padding:25px 0 5px 0; } .join-ul2 li div { height: 95px; } .join-li-t { padding:30px 5%; border-bottom: 1px solid #5c5d60; font-size: 1.25rem; } .join-li-t .join-li-div { margin-top: 20px; } .join-li-t .join-li-div a{ width: 105px; line-height: 38px; height: 38px; font-size: 0.875rem; color: #fff; background: #0085ff; display: inline-block; text-align: center; border-radius: 3px; } .join-li-b { padding:30px 5%; font-size: 0.875rem; color: #bbbbbb; overflow: hidden; } .join-li-b .join-li-bs { float: left; width: 50%; line-height: 30px; } .join-li-b .join-li-bs h4 { color: #fff; font-size: 1.125rem; padding-bottom: 15px; } .join-ul3 .join-ul3-div { padding:30px 5%; color: #bbbbbb; font-size: 1rem; } .join-ul3 .join-ul3-div .join-ul3-input { width: 50%; float: left; } .join-ul3 .join-ul3-div .join-ul3-input input { width: 90%; margin: 12px 0 20px 0; height: 48px; text-indent: 10px; color: #fff; border: 1px solid #555759; background: none; } .join-ul3 .join-ul3-div .join-ul3-box textarea { border: 1px solid #555759; background: none; padding:10px; width: 95%; margin: 12px 0 20px 0; color: #fff; min-height: 60px; } .join-ul3 .join-ul3-div .join-ul3-a { width: 120px; height: 45px; line-height: 45px; text-align: center; color: #fff; border-radius: 3px; font-size: 1rem; background: #0085ff; display: inline-block; } .contact { padding: 65px 3.5%; overflow: hidden; } .contact-l { font-size: 0.875rem; color: #fff; width: 33%; } .contact-l p{ line-height: 30px; } .contact-l h2{ font-size: 1.625rem; } .contact-l h3{ font-size: 1.25rem; margin-top: 60px; padding-bottom: 15px; } .contact-l .contact-ewm { margin-top: 50px; } .contact-map { width: 50%; text-align: right; } .contact-l section { padding-bottom: 10px; } .serivce-download { width: 83.5%; padding: 0; margin: 0 auto; } .serivce-download .serivce-download-li { padding:30px 0; background-color: #3a3d43; } .serivce-download ul li { border-top: 1px solid #616469; padding: 22px 0; font-size: 1rem; overflow: hidden; } .serivce-download .serivce-download-li { border-top: 0px solid #616469; } .serivce-download ul li div { float: left; width: 40%; padding: 0 5px; } .serivce-download ul li .serivce-download-l{ padding-left: 3%; } .serivce-download ul li .serivce-download-r{ width: 10%; } .serivce-download ul li .serivce-download-l img { margin-right: 12px; } .serivce-download ul li .serivce-download-a { height: 40px; line-height: 40px; width: 108px; text-align: center; border-radius: 3px; color: #fff; background-color: #0065c3; font-size: 1rem; display: inline-block; } @media(max-width:1920px) { @media(max-height:975px) { } } @media(max-width:1700px) { .swiper-container .swiper-slide .swiper-slide-video { height: 700px; } .home-news-r { height: 410px; } } @media(max-width:1680px) { .home-news-r { height: 393px; } .home-news-d { padding: 3.5% 4%; } .home-news-l .home-news-t h4 { margin-bottom: 30px; } .home-us-r h2 { margin-top: 6%; } .swiper-container .swiper-slide .swiper-slide-video { height: 650px; } .about-honor ul li .honor-img { height: 405px; } .about-honor ul li .honor-con { line-height: 25px; height: 120px; } .news-detailed-bottom ul li .news-detailed-bottom-con { padding: 4% 5%; } .news-detailed-a a { width: 31%; } .product-detailed-div ul li span { width: 25%; } .product-detailed-div ul li section { padding-left: 28%; padding-right: 5%; } .about-equipment-nav a { margin: 0 4%; } .about-equipment-ul li { height: 370px; } .gallery-top .swiper-slide .swiper-slide-img { left: 64.5%; } } @media(max-width:1560px) { .home-news-r { height: 370px; } .swiper-container .swiper-slide .swiper-slide-video { height: 600px; } .about-honor ul li .honor-img { height: 370px; } .news-detailed-bottom ul li .news-detailed-bottom-con h3 { padding-bottom: 5px; } .product-detailed-div ul li { font-size: 1.25rem; } .join-li-t { padding-bottom: 20px; } .join-li-b { padding-top: 20px; } .join-li-b .join-li-bs h4 { padding-bottom: 5px; } .about-equipment-ul li { height: 340px; } .gallery-top .swiper-slide .swiper-slide-img { left: 66%; } } @media(max-width:1440px) { .home-news-r { height: 338px; } .swiper-container .swiper-slide .swiper-slide-video { height: 570px; } .home-news-d .home-news-time2 { margin-top: 20px; } .home-news-l .home-news-t h4 { margin-bottom: 20px; } .home-us-r h2 { margin-top: 6%; } .home-ty-ul li { height: 235px; } .home-ty-ul .home-ty-li { background-size: 95%; } .about-honor ul li .honor-img { height: 350px; } .about-honor ul li .honor-con { padding: 5% 7%; height: 110px; } .about-honor ul li .honor-con .honor-titme { padding-bottom: 3px; } .news-detailed-bottom ul li .news-detailed-bottom-con h3 { padding-bottom: 5px; } .news-detailed-bottom ul li .news-detailed-bottom-con { padding: 3%; } .research ul li .research-li-title { padding: 20px 0 10px 0; } .research ul li .research-li-com section { line-height: 30px; height: 60px; } .join-box-l { line-height: 25px; padding-top: 30px; } .about-equipment-ul li { height: 310px; } .gallery-top .swiper-slide .swiper-slide-img { left: 67%; } } @media(max-width:1360px) { .home-news-r { height: 317px; } .swiper-container .swiper-slide .swiper-slide-video { height: 530px; } .home-news-d .home-news-time2 { margin-top: 15px; } .home-news-l .home-news-t h4 { margin-bottom: 13px; } .home-us-r .home-us-t { padding: 2% 0 4% 0; } .home-ty-ul li { height: 210px; padding-top: 10px; } .about-honor ul li .honor-img { height: 325px; } .news-detailed-bottom-con .news-detailed-bottom-time { padding-top: 20px; } .case-ul li .case-title { padding: 20px 6%; } .contact-l section { line-height: 25px; } .about-equipment-ul li { height: 295px; } .gallery-top .swiper-slide .swiper-slide-img { left: 68%; } } @media(max-width:1280px) { .home-news-r { height: 300px; } .swiper-container .swiper-slide .swiper-slide-video { height: 480px; } .home-news-d { padding: 3% 4%; } .home-news-l .home-news-t { padding: 15px 20px 12px 20px; } .home-us-r .home-us-a { margin: 4% auto 0 auto; } .home-us-r { padding-left: 10px; } .home-ty-ul li { height: 210px; } .about-honor ul li .honor-img { height: 305px; } .about-honor ul li .honor-con { line-height: 22px; } .news-detailed-bottom ul li .news-detailed-bottom-con h3 { padding-bottom: 0px; } .news-detailed-bottom-con .news-detailed-bottom-time { padding-top: 5px; } .product-detailed-div ul li span { padding-left: 1%; } .product-detailed-div ul li { padding: 20px 0; height: 90px; } .research ul li .research-li-com section { line-height: 25px; height: 55px; } .join-box-title { padding-bottom: 5px; } .join-box-l { padding-top: 15px; line-height: 25px; } .join-ul2 li { padding: 2% 1%; line-height: 25px; } .about-equipment-nav a { font-size: 1.75rem; } .about-equipment-ul li { height: 275px; } .gallery-top .swiper-slide .swiper-slide-img { left: 70%; } } @media(max-width:1152px) { .home-news-r { height: 275px; } .swiper-container .swiper-slide .swiper-slide-video { height: 420px; } .home-news-d { padding: 3%; } .home-news-d .home-news-time2 { margin-top: 10px; } .home-news-l .home-news-t { padding: 3%; } .home-news-l .home-news-t h4 { margin-bottom: 2px; font-size: 1.125rem; } .home-us-r { padding-left: 10px; line-height: 22px; } .home-ty-ul li { height: 190px; } .about-honor ul li .honor-img { height: 275px; } .contact-l h2 { font-size: 1.375rem; } .about-equipment-nav { width: 32%; } .about-equipment-ul li { height: 245px; } .gallery-top .swiper-slide .swiper-slide-img { left: 72%; } } @media(max-width:1024px) { .home-news-r { height: 251px; } .home-news-d .home-news-time2 { margin-top: 0px; } .home-news-d { padding: 2% 3%; } .home-us-r h2 { margin-top: 0%; font-size: 1.5rem; } .home-us-box2 { font-size: 1.625rem; } .home-ty h1 { font-size: 1.625rem; } .home-us-box3 li div { font-size: 1.625rem; } .home-ty-ul li { height: 180px; } .home-us-r h2 { font-size: 1.5rem; } .about-equipment-nav { width: 35%; font-size: 1.5rem; } .about-equipment-nav a{ font-size: 1.5rem; } .about-equipment-ul li { height: 215px; } .gallery-top .swiper-slide .swiper-slide-img { left: 73.5%; } .swiper-container .swiper-slide .swiper-slide-video { height: 410px; } .serivce-download ul li .serivce-download-a { width: 80px; } } @media(max-width:480px) { } @media(max-width:414px) { .content { padding-top: 1px; } .swiper-container .swiper-button-prev { background: url(../img/sakura-icon45.png) no-repeat 4.5% center ; height: 23px; width: 50px; background-size: 100%; top: 42%; } .swiper-container .swiper-button-next{ background: url(../img/sakura-icon46.png) no-repeat 4.5% center ; height: 23px; width: 50px; background-size: 100%; top: 42%; } .swiper-container .swiper-button-prev:hover { background: url(../img/sakura-icon20.png) no-repeat 4.5% center ; height: 23px; width: 50px; background-size: 100%; } .swiper-container .swiper-button-next:hover{ background: url(../img/sakura-icon21.png) no-repeat 4.5% center ; height: 23px; width: 50px; background-size: 100%; } .swiper-container .swiper-slide .swiper-slide-a { width: 80px; height: 30px; line-height: 30px; font-size: 1rem; top: 55%; } .swiper-container .swiper-slide .swiper-slide-video { height: 165px; } .swiper-service .swiper-container .swiper-button-prev{ background: url(../img/sakura-icon24.png) no-repeat center #000; background-size: 60%; height: 81%; width: 4.4%; top: 31px; } .swiper-service .swiper-container .swiper-button-next { background: url(../img/sakura-icon25.png) no-repeat center #000 ; background-size: 60%; height: 81%; width: 4.4%; top: 31px; } .swiper-service .swiper-container .swiper-button-prev:hover{ background: url(../img/sakura-icon24.png) no-repeat center #000; background-size: 60%; height: 81%; width: 4.4%; top: 31px; } .swiper-service .swiper-container .swiper-button-next:hover { background: url(../img/sakura-icon25.png) no-repeat center #000 ; background-size: 60%; height: 81%; width: 4.4%; top: 31px; } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { width: 30px; } .home-pro2 { padding: 0 15px; margin:20px auto; } .home-pro2 .home-pro2-img { width: 48.5%; } .home-pro2 .home-pro2-img span { margin-right: 5px; } .home-pro2 .home-pro2-img p { margin-top: 25%; } .content-home { width: 100%; padding: 0 15px; } .home-pro { height: 24vh; } .home-pro-img > img { height: 24vh; } .home-us { padding: 20px 0 0 0; } .home-us-img { width: 100%; } .home-us-r { width: 100%; } .home-us-r h2 { margin-top: 15px; } .home-us-r .home-us-t { padding: 5px 0 10px; 0; } .home-us-r .home-us-a { margin-top: 10px; } .home-us-box2 { padding: 20px 0 0px 0; } .home-us-box3 { margin-bottom: 20px; } .home-us-box3 li div img { margin: 0 12px 0px 0; } .home-news-l, .home-news-r{ width: 100%; } .home-news-r { margin-bottom: 15px; } .home-news-l .home-news-t { padding: 10px 20px 8px 20px; margin-bottom: 20px; } .home-news-l .home-news-t h4 { margin-bottom: 10px; } .home-news-r li { margin-right: 0; } .home-news-a { padding: 0; padding-bottom: 20px; } .home-ty h1 { margin-bottom: 15px; } .home-ty-ul li { padding-top: 5px; height: 210px; } .home-ty-ul li .home-ty-div { padding: 10px 0 5px 0; } .home-ty-ul li .home-ty-input { margin-top: 15px; width: 90%; } .home-ty-ul li .home-ty-a { margin-top: 15px; width: 90%; } .home-ty-ul .home-ty-li { background-size: 100%; } .about-nav { width: 100%; padding: 0 15px; } .content-list { padding-top: 20px; } .about-nav a { height: 40px; line-height: 40px; } .content-list-box { width: 100%; padding: 15px; } .about-us section { line-height: 22px; padding-bottom: 10px; } .content-list { padding-bottom: 20px; } .about-idea .about-idea-l { width: 100%; } .about-idea-img { width: 100%; margin-top: 15px; } .about-idea .about-idea-l h3 { margin: 15px 0 5px 0; } .about-idea-b { margin-top: 25px; } .about-idea-b h1 { padding: 15px 0 5px 0; font-size: 1.625rem; } .about-idea-b .about-idea-ys { width: 100%; margin-left: 0; line-height: 22px; margin-bottom: 15px; } .about-idea-b .about-idea-ys h3 { margin-bottom: 5px; } .about-culture-box2 { margin-bottom: 20px; line-height: 22px; } .about-culture h1 { margin-bottom: 10px; font-size: 1.625rem; } .about-culture-box .about-culture-l { width: 100%; } .about-culture-box .about-culture-t { padding: 5px 0; } .content-list-box { line-height: 22px; } .about-culture-box .about-culture-img { width: 100%; } .about-equipment-nav { width: 65%; } .about-equipment-nav a { font-size: 1.625rem; display: inline-block; width: 96px; float: left; margin: 0 10px; } .about-equipment-box li { margin-bottom: 20px; } .about-equipment-ul li { height: 100px; } .about-honor ul li { width: 47%; margin-bottom: 15px; } .about-honor ul li .honor-img { height: 250px; } .about-honor h1 { padding-bottom: 10px; font-size: 1.625rem; } .content-list-news { width: 100%; padding: 0 15px; } .content-list-news ul li { width: 100%; } .content-list-news .news-img { width: 100%; } .content-list-news .news-con { width: 100%; } .about-idea .about-idea-l h2 { font-size: 1.625rem; } .about-honor ul li .honor-con .honor-titme { padding-bottom: 0px; } .about-honor ul li .honor-con { line-height: 22px; height: 110px; } .content-list-news .news-con { padding: 3% 3%; } .content-list-news .news-con section { line-height: 22px; padding: 5px 0 10px 0; } .news-detailed .news-detailed-n { padding: 15px 0 10px 0; } .news-detailed-box { width: 100%; padding: 0; } .news-detailed .news-detailed-title { font-size: 1.5rem; color: #fff; padding: 15px 0 10px 0; } .news-detailed .news-detailed-time { padding-bottom: 5px; } .news-detailed-box section { padding-bottom: 15px; line-height: 25px; } .news-detailed-box p { margin-bottom: 20px; } .news-detailed-a { padding: 2px 0 20px 0; } .news-detailed-a a { width: 31%; line-height: 40px; } .news-detailed-bottom { padding: 20px 15px; } .news-detailed-bottom h1 { padding-bottom: 10px; font-size: 1.625rem; } .news-detailed-bottom ul li { width: 100%; margin-bottom: 15px; margin-left: 0; } .news-detailed-bottom ul li .news-detailed-bottom-img { width: 100%; } .news-detailed-bottom ul li .news-detailed-bottom-con { width: 100%; } .news-detailed-bottom ul li .news-detailed-bottom-con { padding: 15px; } .news-detailed-bottom ul li .news-detailed-bottom-con h3 { padding-bottom: 0px; } .news-detailed-bottom-con .news-detailed-bottom-time { padding-top: 10px; } .news-detailed-bottom .news-detailed-a2 { padding-top: 0px; } .product-con { padding: 10px 15px 0 15px; width: 100%; } .content-list-product { width: 100%; padding: 0 10px; } .content-list-product .product-img a { width: 47%; margin: 0 5px; margin-bottom: 15px; } .list-page { width: 100%; } .list-page a { font-size: 1.125rem; width: 35px; height: 35px; line-height: 35px; margin-bottom: 10px; margin: 0 2px; } .list-page .page-a { width: 60px; margin-bottom: 10px; } .list-page { padding-top: 10px; } .product-detailed-nav { padding: 15px 0; } .product-detailed-nav .detailed-active { font-size: 1.625rem; } .product-detailed-box { padding-bottom: 30px; } .product-detailed-div { width: 100%; font-size: 1rem; border-top: 1px solid #5f6061; } .product-detailed-div ul li { padding: 10px 0; height: auto; font-size: 1rem; } .product-detailed-div ul li span { width: 31%; padding-left: 0%; } .product-detailed-div ul li section { padding-left: 34%; padding-right: 10%; padding-right: 10px; } .case-search { width: 80%; left: 10%; height: 40px; } .case-search .case-icon { height: 40px; } .case-search .case-input { height: 40px; } .case-search .case-cx { height: 40px; line-height: 40px; } .case-search { bottom: -20px; } .content-list-case { margin-top: 25px; } .case-ul li .case-title { padding: 10px 6%; } .serivce-after-box { padding: 20px 0 10px 0; margin-top: 20px; } .serivce-after-box .serivce-after-div { width: 100%; padding-bottom: 15px; } .research ul li { width: 100%; margin: 0; border-bottom: 1px solid #fff; margin-bottom: 20px; } .research ul li .research-li-title { font-size: 1.5rem; padding: 10px 0 5px 0; } .research ul li .research-li-com section { line-height: 22px; height: auto; margin-bottom: 10px; } .join-nav { width: 50%; left: 25%; } .join-nav { top: -20px; } .join-nav a { height: 40px; line-height: 40px; } .list-join { width: 100%; padding: 20px 15px; } .join-ul li { width: 100%; } .join-box-l { padding: 15px; line-height: 22px; width: 75%; } .join-box-title { padding-bottom: 7px; } .join-box-img { padding: 7% 15px; width: 25%; } .join-box-l section { height: auto; } .join-title { margin-bottom: 16px; } .join-title .join-n { font-size: 3rem; line-height: 60px; margin-right: 10px; } .join-title .join-con p { font-size: 1.5rem; } .join-title .join-con section { font-size: 1.125rem; } .join-ul { margin-bottom: 10px; } .join-ul2 li img { width: 50%; } .join-ul2 li h2 { font-size: 1.125rem; padding: 10px 0 0px 0; } .join-ul2 li div { height: 95px; line-height: 22px; padding: 0 5px; height: 135px; } .join-ul2 { margin-bottom: 25px; } .join-li-t { font-size: 1.125rem; padding: 15px; } .join-li-t .join-li-div { margin-top: 10px; } .join-li-b { padding: 15px; } .join-li-b .join-li-bs h4 { padding-bottom: 0px; } .join-ul3 .join-ul3-div { padding: 15px; } .join-ul3 .join-ul3-div .join-ul3-input input { margin: 5px 0 10px 0; } .join-ul3 .join-ul3-div .join-ul3-box textarea { margin: 5px 0 10px 0; } .contact-l { width: 100%; } .contact-map { width: 100%; } .contact-l h2 { font-size: 1.25rem; margin-bottom: 5px; } .contact-l h3 { margin-top: 15px; padding-bottom: 0px; } .contact-l p { line-height: 22px; } .contact-l section { padding-bottom: 2px; } .contact-l .contact-ewm{ margin-top: 15px; margin-bottom: 25px; } .gallery-top { background-size: 100%; height: 225px; } .gallery-thumbs { height: 90px; } .gallery-top .swiper-slide .swiper-slide-img { left: 62.5%; top: 6%; } .gallery-top .swiper-slide .swiper-slide-img img{ width: 40%; } .gallery-thumbs .swiper-slide .swiper-slide-img img{ width: 30%; } .join-shop-jg { font-size: 1.375rem; line-height: 40px; height: 40px; } .join-shop-jg b { font-size: 1.375rem; } .join-shop-box { padding-top: 5px; } .join-shop-box .right { float: left; margin-top: 5px; } .shop-search { padding: 0 0px; } .shop-search-nav { margin-bottom: 20px; } .shop-search-nav a { line-height: 40px; font-size: 1.625rem; width: 70px; } .join-shop-box { margin-bottom: 15px; } .join-shop-cs { padding: 10px 3%; } .join-shop-cs li .join-shop-cs-l { padding-bottom: 0px; } .join-shop-cs li .join-shop-cs-r { width: 100%; padding-bottom: 15px; } .join-shop-cs li .join-shop-cs-r a { margin: 0; margin-right: 4%; } .serivce-download ul .serivce-download-li .serivce-download-l { padding-left: 10px; } .serivce-download ul li, .serivce-download .serivce-download-li{ padding: 15px 0; } .serivce-download ul li .serivce-download-l { padding-left: 0; width: 50%; } .serivce-download ul li .serivce-download-l img{ float: left; margin-top: 5px; } .serivce-download ul li .serivce-download-l span{ float: left; width: 80%; } .serivce-download ul li .serivce-download-a { width: 60px; } .serivce-download ul li .serivce-download-c { width: 30%; } } @media(max-width:375px) { } /* footer*/ #top { position: fixed; bottom: 30%; right: 0; width: 60px; height: 60px; z-index: 9; } .footer{ background: #313131; width: 100%; color: #aeaeae; } .footer-box { width: 85%; margin: 0 auto; padding:50px 0 40px 0; font-size: 0.875rem; } .footer-l { width: 18.5%; margin-right: 14%; } .footer-l .footer-n { color: #fff; margin-top: 230px; font-size: 2.375rem; } .footer-l .footer-n div { font-size: 1.125rem; background: url(../img/sakura-icon14.png) no-repeat left center; padding-left: 32px; } .footer-c { width: 60%; } .footer-c ul li { float: left; width: 16.6%; line-height: 36px; } .footer-c ul li .footer-title { color: #fff; font-size: 1.125rem; padding-bottom: 16px; } .footer-c ul li a { color: #aeaeae; display:block; font-size: 0.875rem; } .footer-r { width: 6.8%; text-align: right; } .footer-b { width: 100%; clear:both; overflow: hidden; color: #878787; padding-top: 40px; } .footer-r section{ margin: 12px 0 35px 0; } .right { float: right; } .left{ float: left; } @media(max-width:1680px) { .footer-l { width: 20%; margin-right: 12%; } .footer-l .footer-n { margin-top: 150px; } } @media(max-width:1440px) { } @media(max-width:1360px) { .footer-l { width: 22%; margin-right: 10%; } } @media(max-width:1280px) { .footer-l .footer-n{ font-size: 2.125rem; } } @media(max-width:1152px) { .footer-l .footer-n{ font-size: 2rem; } } @media(max-width:1024px) { .footer-l .footer-n { font-size: 1.75rem; } } @media(max-width:414px) { .footer-box { width: 100%; padding: 0 15px; margin-top: 35px; } .footer-l { width: 100%; } .footer-l img { width: 40%; float: left; } .footer-l .footer-n { float: right; margin-top: 0; font-size: 2rem; } .footer-c { width: 80%; } .footer-c ul li { width: 30%; line-height: 22px; height: 160px; } .footer-c ul li .footer-title { padding-bottom: 0; } .footer-r { width:20%; padding-top: 10px; } .footer-c ul .footer-li{ height: 70px; } .footer-b { padding-top: 1px; margin-bottom: 25px; } .footer-r section { margin: 10px 0 15px 0; } .footer-b div { float: left; } #top { width: 45px; height: 45px; } }