* { margin: 0; padding: 0; } .mr-0 { margin-right: 0 !important; } .mb-20 { margin-bottom: 20px; } .left { float: left; } .right { float: right; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .text-center { text-align: center; } .bg-white { background-color: #fff; } .index-right-co { font-size: 12px; vertical-align: top; } /* 椤堕儴 */ .head { background-color: #35495a; height: 160px; box-sizing: border-box; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .menu { display: block; } .menu-btn { display: none; } .menu li:hover { cursor: pointer; } .login_btn { color: #96b0cd !important; } .login-icon { width: 34px; height: 34px; display: inline-block; background-image: url(../images/index/icon_user.png); margin-bottom: -10px; margin-right: 5px; } /* ; */ .menu2-box { background: rgba(53, 73, 90, 0.9); width: 100%; min-width: 1200px; height:50px; position: absolute; left: 0; top: 97px; display: none; z-index: 12; border-top: 1px solid rgba(255, 255, 255, 0.1); } .menu3-box { width: 100%; height: 486px; background: rgba(53, 73, 90, 0.9); position: absolute; left: 0; top: 97px; display: none; z-index: 12; border-top: 1px solid rgba(255, 255, 255, 0.1); } /* banner */ .banner { position: relative; width: 100%; height: 650px; background: url("../images/index/icon_index_banner.jpg") no-repeat center; background-size: 100% 650px; } .banner-content { width: 100%; height: 180px; background-color: rgba(255, 255, 255, 0.9); text-align: center; color: #35495a; letter-spacing: 1.5; position: absolute; top: 775px; left: 0; } .banner-title { font-size: 40px; font-family: "榛戜綋"; margin-top: 28px; margin-bottom: 10px; letter-spacing: 3; } .banner-descript { font-size: 14px; line-height: 24px; } /* 鎴愬氨 */ .achieve-item { width: 220px !important; height: 252px !important; margin-left: 10px !important; margin-right: 10px !important; background-color: #435c71; margin-top: 50px; color: #fff; text-align: center; transition: all 0.5s; } .achieve-item:hover { cursor: pointer; margin-top: 20px; background-repeat: no-repeat; box-shadow: 0 0 12px 8px rgba(0, 0, 0, 0.3); } .achieve-item-1:hover { background-image: url("../images/index/icon_achieve_bg.png"); } .achieve-item-2:hover { background-image: url("../images/index/icon_achieve_bg_2.png"); } .achieve-item-3:hover { background-image: url("../images/index/icon_achieve_bg_3.png"); } .achieve-item-4:hover { background-image: url("../images/index/icon_achieve_bg_4.png"); } .achieve-item-5:hover { background-image: url("../images/index/icon_achieve_bg_5.png"); } .achieve-item:hover * { display: none; } .achieve-title { margin-top: 40px; font-size: 40px; } .achieve-title:after { content: "-"; display: block; height: 20px; line-height: 20px; margin-bottom: 20px; } /* 瑙e喅鏂规 */ .index-solution-box { height: 600px; background-color: #edf4f9; padding: 106px 0 138px 0; box-sizing: border-box; } .solution-title-box { display: inline-block; } .solution-title { position: relative; padding: 0 40px 5px; font-size: 28px; font-weight: 400; color: #35495a; } .solution-title:before { content: ""; position: absolute; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 9px solid #35495a; display: block; width: 0; height: 0; top: 9px; left: 0; } .solution-title:after { content: ""; position: absolute; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-right: 9px solid #35495a; display: block; width: 0; height: 0; top: 9px; right: 0; } .solution-split { height: 1px; background-color: #4c5e6e; } .solution-descript { color: #4287a6; font-size: 18px; line-height: 46px; letter-spacing: 5px; margin-right: -5px; } .solution-list { margin-top: 80px; } .solution-item { width: 238px; margin: 0 20px; display: inline-block; vertical-align: top; position: relative; transition: all 0.2s ease-in; } .solution-item:after { content: ""; width: 20px; height: 4px; background-color: #4a90e2; position: absolute; bottom: -14px; left: 50%; margin-left: -10px; opacity: 0; } .solution-item-name { width: 182px; height: 182px; font-size: 20px; font-weight: 700; border-radius: 50%; border: 1px solid #586978; color: #35495a; text-align: center; line-height: 182px; margin: 0 auto 25px; transition: all 0.2s; position: relative; } .solution-item-name:after { content: ""; position: absolute; top: 8px; left: 8px; width: 166px; height: 166px; border-radius: 50%; border: 1px solid #fff; opacity: 0; transition: all 0.2s; } .solution-item-description { color: #0c3c60; font-size: 13px; } .solution-item:hover { cursor: pointer; margin-top: -35px; } .solution-item:hover .solution-item-name { box-shadow: 0 0 10px 6px rgba(0, 0, 0, 0.3); background-color: #4a90e2; border-color: #4a90e2; color: #fff; } .solution-item:hover .solution-item-name:after { opacity: 1; } .solution-item:hover .solution-item-description { color: #4a90e2; } .solution-item:hover:after { opacity: 1; } /* 鐗圭偣 */ .index-feature-box { height: 760px; background-image: url("../images/index/icon_feature_bg.jpg"); background-repeat: no-repeat; background-size: 100% 760px; } .feature-left { margin-top: 126px; width: 460px; height: 500px; background-image: url("../images/index/icon_feature_left.png"); background-repeat: no-repeat; background-position: left center; } .feature-right { width: 640px; margin-top: 126px; color: #f2f3f5; } .feature-logo { font-size: 40px; color: #fff; } .feature-list { margin: 48px 0; } .feature-item { float: left; width: 150px; height: 35px; border: 1px solid #fff; text-align: center; line-height: 37px; margin-right: 10px; transition: all 0.2s; } .feature-item:hover { cursor: pointer; background-color: #fff; color: #35495a; border-color: #fff; } .feature-more { display: block; text-align: center; line-height: 36px; width: 150px; height: 36px; background-color: #b7d3f3; color: #35495a; margin-top: 60px; } .feature-more:hover { background-color: #a9c7e8; } /* 璁よ瘉 */ .index-iso { width: 100%; height: 350px; margin-top: 30px; background: url(".././images/index_f.png") no-repeat center; background-size: auto 198px; background-position: center; background-color: #ffffff; } /* 搴曢儴 */ .index-footer { width: 100%; height: 300px; background-color: #35495a; position: relative; padding-top: 50px; box-sizing: border-box; } .footer-box { color: #b4bec7; font-size: 16px; line-height: 30px; } .footer-box .index-tel { color: #4a90e2; font-weight: 700; font-size: 24px; } .qr-code { display: inline-block; margin-top: 20px; font-size: 12px; } .qr-code img { margin-bottom: 5px; } .qr-code p { text-align: center; line-height: 20px; } .footer-info-right li { margin-bottom: 20px; } .footer-info-right li label { width: 200px; display: inline-block; } /* 瑕嗙洊 style 涓殑鏍峰紡 */ .header { height: 50px; padding-top: 45px; } .header .logo { height: 50px; width: auto; } .header .menu ul li.over a, .header .menu ul li a:hover { border-bottom: 2px solid #b4bec7; } .header .menu ul li a.login_btn:hover { border-color: transparent; } .header .menu ul li a { color: #ffffff; height: 50px; line-height: 60px; display: inline-block; } .index_banner_f { margin-top: 0; height: 360px; width: 100%; box-shadow: none; } .footer-right { width: 100%; position: absolute; bottom: 40px; text-align: center; font-size: 14px; color: #b4bec7; } @media screen and (max-width: 768px) { body { width: 100% !important; min-width: auto; /* overflow: hidden; */ } .header { padding-left: 10px; padding-right: 10px; box-sizing: border-box; height: auto; padding-top: 20px; } .head { height: 74px; } .header .logo { width: 74%; height: auto; } .width_1200 { width: 100%; } .menu-btn { width: 80px; height: 30px; border-radius: 15px; border: 1px solid #fff; display: block; /*background-image: url("../images/index/icon_menu.png");*/ position: absolute; right: 10px; top: 22px; background-repeat: no-repeat; background-position: center; text-align: center; line-height: 30px; color: #fff; font-size: 12px; } .menu { display: none; width: 116px; box-sizing: border-box; height: auto !important; padding-left: 10px; padding-right: 10px; /*background: rgba(53, 73, 90, 0.9);*/ background-color: #fff; border-radius: 5px; box-shadow: 0 2px 6px 0 rgba(53,53,53,.2); position: fixed; top: 56px; right: 10px; } .header .menu ul li { width: 100%; line-height: 34px; border-bottom: 1px solid #9aa4ad; } .header .menu ul li:last-child { border-bottom: none; } .header .menu ul li a { color: #35495a; height: 34px; line-height: 34px; } .header .menu ul li a .login-icon { display: none; } .header .menu ul li.over a, .header .menu ul li a:hover { border-bottom: none; } .menu3-box { width: 60%; box-sizing: border-box; padding-left: 20px; height: auto; right: 126px; left: initial; } .menu3 { height: auto; width: 100% !important; } .menu2-box { width: 60%; padding-left: 20px; box-sizing: border-box; height: auto; min-width: auto; right: 126px; left: initial; } #menu2 div ul li { width: 100%; line-height: 40px; } #menu2 div { width: 100%; } .banner { background-size: 100% 300px; height: 195px; } .banner-content { top: 54%; height: 108px; } .banner-title { font-size: 18px; margin-top: 10px; margin-bottom: 5px; } .banner-descript { font-size: 12px; letter-spacing: 0.8; line-height: 20px; } .index_banner_f { height: auto; margin-top: 0px; height: auto; padding: 0 20px 0 20px; box-sizing: border-box; } .achieve-title { font-size: 14px; margin-top: 5px; } .achieve-title:after { line-height: 10px; height: 10px; margin-bottom: 3px; } .achieve-item { width: calc(20% - 10px) !important; margin: 0 5px 10px 5px !important; font-size: 10px; height: 140px !important; background-color: #4a90e2; } .solution-title { padding: 0 20px; font-size: 20px; } .solution-descript { font-size: 14px; letter-spacing: none; line-height: 24px; } .index-solution-box { height: auto; } .solution-title-box { width: 90%; } .solution-list { margin-top: 10px; display: inline-block; } .solution-item { margin-bottom: 80px; /*width: 25%;*/ /*width: calc(25% - 10px) !important;*/ width: 82px; margin: 0 5px 10px 5px !important; float: left; background-color: #35495a; border-radius: 82px; padding-bottom: 10px; height: 306px; } .solution-item-name:after { /*content: '';*/ display: none; } .solution-item-name { width: 80px; height: 80px; line-height: 80px; box-sizing: border-box; font-size: 16px; background-color: #edf4f9; } .solution-item p { color: #fff; padding: 0 8px; font-size: 10px; } .index-solution-box { padding-bottom: 0; padding: 40px 0; } .index-feature-box { background-size: cover; background-position: center; height: 350px; padding: 50px 0; } .feature-list { margin: 5px 0; } .feature-left { margin-top: 0; width: 50%; background-size: 90%; background-position: center; height: 350px; } .feature-right { height: 300px; width: 50%; text-align: center; /*margin: 0 auto;*/ padding: 0 10px; box-sizing: border-box; /*float: none;*/ margin-top: 0; padding-bottom: 20px; font-size: 10px; } .feature-right .mb-20 { margin-bottom: 5px; } .feature-logo { font-size: 20px; } .feature-item { width: calc(50% - 10px); margin-right: 5px; margin-left: 5px; box-sizing: border-box; margin-bottom: 10px; height: 22px; line-height: 22px; } .feature-more { width: 100%; height: 24px; line-height: 24px; margin-left: auto; margin-right: auto; margin-bottom: 5px; margin-top: 5px; } .index-iso { margin-top: 10px; height: 85px; background-size: 160% auto; } .index-news-box { width: 90% !important; margin: 0 auto !important; } .index-news-box>div { width: 100% !important; } .index_new_title { margin-top: 30px; font-size: 18px; height: 30px; line-height: 30px; } .index_new_title img{ margin-top: 6px; width: 20px; } .index_news ul li { height: 64px; } .index_news ul li a { margin-top: 5px; font-size: 14px; } .index_news ul li div { font-size: 14px; } .index-footer { height: auto; } .footer-logo { margin-bottom: 20px; } .footer-info-left { text-align: center; float: none; } .footer-info-right { text-align: center; float: none; margin-top: 40px; } .footer-info-right li { text-align: left; padding: 0 10px; width: 100%; box-sizing: border-box; } .footer-right { position: static; padding: 10px; box-sizing: border-box; } .footer-info-right li label { width: 160px; } } /* 鍏充簬鎴戜滑 */ .about-content-box { background-color: #fff; } .about-content-container { background-color: #edf4f9; padding-bottom: 120px; } .about-content-container * { color: #fff !important; } .about-white-bg { height: 350px; background-color: #fff; } .content_title { margin-top: 0; } .about-desript { background-color: #4a90e2; padding: 70px; box-sizing: border-box; position: relative; top: -235px; } .about-desript:after { position: absolute; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 30px solid #4a90e2; content: " "; display: block; width: 0; height: 0; bottom: -20px; left: 50%; margin-left: -40px; } .color-blue { color: #4a90e2 !important; } .blue-title { position: relative; } .blue-title:after { content: ""; width: 60px; height: 2px; background-color: #4a90e2; position: absolute; left: 50%; bottom: -10px; margin-left: -30px; } .about-content-team { margin-top: -135px !important; } .about-team-box { padding-top: 45px; } .about-echart { height: 390px; position: relative; background-size: 100% 246px; /* margin-top: 50px; */ width: 390px; float: left; display: inline-block; margin-left: 135px; margin-right: 160px; } .about-list { width: 410px; } .about_team { position: relative; background-color: #4a90e2; padding: 10px 50px; box-sizing: border-box; width: 380px !important; height: 112px; margin: 10px 0; vertical-align: middle; display: inline-block; line-height: 112px; text-align: justify; } .about_team p { vertical-align: middle; display: inline-block; line-height: 22px; } .about_team:before { position: absolute; border-top: 16px solid transparent; border-bottom: 16px solid transparent; border-right: 16px solid #4a90e2; content: " "; display: block; width: 0; height: 0; top: 36%; left: -16px; } .about-map { width: 100%; padding: 60px 0 80px; background-color: #35495a; } .about-map-left { color: #fff; float: left; width: 540px; height: auto; padding-right: 60px; padding-top: 140px; line-height: 40px } .fz-24 { font-size: 20px; margin-bottom: 50px; } .color-light-blue { color: #bdd8f8 !important; } .about-map-site { float: left; width: 600px; height: 570px; background-image: url('../images/about/icon_map.png'); background-repeat: no-repeat; background-size: 100% 100%; } .about-apply { width: 100%; background: #ffffff; padding-top: 80px; padding-bottom: 90px; } .about-apply-title { color: #35495a !important; font-size: 28px !important; font-weight: 700; position: relative; /* display: inline-block; */ } .about-apply-title:after { content: ""; width: 60px; left: 50%; margin-left: -30px; height: 2px; background-color: #35495a; display: inline-block; bottom: -10px; position: absolute; } .about-apply-list { width: 1200px !important; height: auto; } .about-apply-list li { width: 180px !important; height: 180px; box-sizing: border-box; line-height: 180px; display: inline-block; text-align: center; border-radius: 50%; border: 2px solid #35495a; margin-right: 75px !important; font-size: 24px; color: #35495a; } .about-apply-list li.mr-0 { margin-right: 0 !important; } .rzzz-box { width: 100%; height: 830px; /* background: url('../images/about/3.png') no-repeat center; */ background: #edf4f9; padding-top: 80px; } .rzzz-box-container { margin-top: 46px; height: 320px; } /* */ .about-paper { width: 100%; height: 830px; background-color: #edf4f9; padding-top: 80px; } .about-services-box { width: 100%; height: 700px; background: url("../images/about/about-banner.png") no-repeat center; background-size: 100% 700px; padding-top: 80px; } .about-services-box .title { position: relative; } .about-services-box .title:after { content: ""; width: 60px; left: 50%; margin-left: -30px; height: 2px; background-color: #fff; display: inline-block; bottom: -10px; position: absolute; } .about-services-item { width: 250px !important; height: 64px !important; line-height: 64px !important; border: 1px solid #fff; padding: 0 !important; margin-right: 65px !important; margin-top: 60px; text-align: center; font-weight: 700; font-size: 18px !important; } .about-services-item.mr-0 { margin-right: 0 !important; } .arrow-right { position: relative; border-right: 0; } .arrow-right:after { content: ""; width: 46px; height: 46px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(225deg); -webkit-transform: rotate(225deg); position: absolute; right: -24px; top: 8px; } .arrow-left { position: relative; border-left: 0; } .arrow-left:before { content: ""; width: 46px; height: 46px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(225deg); -webkit-transform: rotate(225deg); position: absolute; left: -24px; top: 8px; z-index: 1; } .about-service-detail-box { margin-top: 78px; } .about-service-detail-box span { background-color: transparent !important; } .swiper-container2 .swiper-button-prev { width: 40px !important; height: 40px !important; border-radius: 50%; background-color: #35495a !important; background-image: url("../images/about/arrow-left.png") !important; background-repeat: no-repeat; background-position: center !important; } .swiper-container2 .swiper-button-prev:hover { background-color: #293a48 !important; } .swiper-container2 .swiper-button-next { width: 40px !important; height: 40px !important; border-radius: 50%; background-color: #35495a !important; background-image: url("../images/about/arrow-right.png") !important; background-repeat: no-repeat; background-position: center !important; } .swiper-container2 .swiper-button-next:hover { background-color: #293a48 !important; } .about_ry { padding: 0; background-color: #35495a; color: #fff; } .about-honor-box { background-color: #edf4f9; padding: 72px 0; overflow: hidden; } .about-history-box { width: 100%; height: 425px; padding-top: 80px; background-color: #ffffff; } .about_history { margin-top: 50px; } .about-history-time { width: 124px; height: 124px; border-radius: 50%; background-color: #4a90e2; color: #fff; font-size: 26px; font-weight: 700; text-align: center; line-height: 124px; margin-bottom: 20px; position: relative; } .about-history-time:after { content: ""; width: 200px; border-bottom: 1px dashed #4a90e2; position: absolute; left: 124px; top: 60px; } .about_history ul li:last-child .about-history-time:after { display: none; } .swiper_about_zizhi { display: none; } @media screen and (max-width: 768px) { .about-white-bg { height: 265px; } .content_title p.title { font-size: 18px; } .about-desript { width: 90%; padding: 20px 20px; } .content_title div { font-size: 12px; margin-top: 0 !important; } .about-echart { margin: 0 auto; width: 80%; height: auto; float: none; } .about-list { width: 100%; padding: 20px; box-sizing: border-box; } .about-team-box { text-align: center; } .about_team:before { display: none; } .about_team { font-size: 12px; width: 100% !important; height: auto; } .about-content-container { padding-bottom: 20px; } .about-map-left { width: 100%; box-sizing: border-box; padding: 20px !important; float: none; font-size: 12px; line-height: 24px; } .fz-24 { font-size: 18px; margin-bottom: 20px; } .about-map-site { width: 90%; height: 350px; background-size: 100% auto; margin: 0 auto; float: none; } .about-map { padding-bottom: 0; } .about-apply { padding: 20px 0; } .about-apply-list { width: 100% !important; background-image: url('../images/about/about_info.png'); background-repeat: no-repeat; background-size: 100% auto; height: 211px; margin-top: 20px; } .about-apply-list>ul { display: none; } .about-apply-list li { display: block; float: none !important; margin: 20px auto !important; } .about-apply-list li.mr-0 { margin: 20px auto !important; } .rzzz-box { height: auto; background-size: auto 100%; padding-bottom: 80px; } .ahout_zizhi div { font-size: 12px; } .ahout_zizhi a { font-size: 8px; color: #fff; line-height: 24px; height: 24px; } .ahout_zizhi span { width: 100%; background-color: #fff; height: 1px; margin: 5px 0; } .ahout_zizhi a i { margin-top: 10px; background-color: #fff; } .swiper-slide { width: 100% !important; margin: 0 auto !important; display: block !important; } .about_ry { width: 100%; margin: 0 auto; } .swiper_about_zizhi { display: block; background-color: #fff !important } .swiper-container1 { display: none; } .rzzz-box-container { height: auto; } .about-paper { height: auto; } .bg-white { height: auto !important; padding: 20px 10px; box-sizing: border-box; } .ahout_zizhi { /*float: none;*/ height: 208px; width: calc(50% - 10px); margin: 0 5px; margin-bottom: 10px; padding: 10px; box-sizing: border-box; background-color: #4a90e2; color: #fff; border-radius: 10px; } .swiper-container { width: 100% !important; } .about_fw { width: 100%; margin-top: 20px; } .about-services-item { width: calc(50% - 12px) !important; margin: 10px 5px !important; border: 1px solid #fff; float: left; font-size: 14px !important; background-color: rgba(196,201,204,.9); border-radius: 8px; color: #35495a !important; border-color: transparent !important; } .about-services-item:after, .about-services-item:before { display: none; } .about-services-box { height: auto; background-size: auto 100%; padding-bottom: 40px; overflow: hidden; } .ahout_fw { width: 100%; padding: 40px 90px; position: relative; } .about-service-detail-box span { display: none; } .ahout_fw div { margin: 20px 0; position: absolute; left: 50px; width: 30px; border: 1px solid #fff; border-radius: 15px; text-align: center; top: 0px; font-size: 16px; padding: 20px 0; } .mobile-hidden { display: none; } .mobile-fw { margin-top: -80px; } .mobile-tese { top: 32px !important; } .ahout_fw a { font-size: 12px; line-height: 24px; height: 24px; } .about-history-box { height: auto; } .about_history { width: 100%; } .about_history ul { width: 90%; margin: 0 auto 20px auto; } .about_history ul li { width: 33%; position: relative; min-height: 180px; padding-left: 0; box-sizing: border-box; padding-top: 20px; margin-right: 0; margin-left: 0; float: left; font-size: 10px; } .about-history-time { width: 74px; height: 74px; line-height: 74px; margin: 0 auto 20px auto; font-size: 18px; } .about-history-time:after { left: 61px; top: 124px; border-bottom: 0; border-left: 1px dashed #4a90e2; height: 56px; width: 0; display: none; } .swiper-slide>div>div>div { margin: 0 auto !important; } } .project-aside-title { color: #35495a; margin-top: 30px; padding-bottom: 14px; border-bottom: 1px solid #35495a; font-size: 18px; font-weight: 700; } .news_more ul li a { color: #35495a; } .mb-20 { margin-bottom: 20px; } .right_btn { background-color: #4a90e2; font-weight: 700; } .project-introduce-box { width: 982px; padding-right: 20px; padding-bottom: 50px; float: left; } .project-introduce { background-color: #edf4f9; text-align: center; line-height: 30px; height: 560px; padding: 160px; box-sizing: border-box; margin-top: 200px; margin-bottom: 70px } .project-introduce-img { margin-top: -250px; } .project-introduce h3 { color: #35495a; font-size: 20px; font-weight: 700; } .project-introduce p { color: #35495a; font-size: 16px; line-height: 40px } .project-list { margin-top: 50px; } .project-list-item { width: 180px; height: 110px; border-radius: 20px; background-color: #4a90e2; float: left; text-align: center; color: #fff; line-height: 110px; margin-right: 20px; margin-bottom: 20px; } .project-list-item>div { display: inline-block; vertical-align: middle; line-height: 24px; } .mb-4 { margin-bottom: 8px; } .mr-0 { margin-right: 0; } .project-list-item>div>h4 { font-size: 18px; font-weight: 700; } .project-feature-item { width: 481px; height: 270px; float: left; margin-right: 20px; margin-bottom: 20px; text-align: left; color: #fff; } .project-feature-item h4 { font-size: 22px; font-weight: 700; margin-top: 50px; margin-bottom: 20px; padding-left: 50px; } .project-feature-item p { line-height: 30px; padding-left: 50px; } .project-feature-item-bg-1 { background-image: url('../images/project/icon_info_1.png'); } .project-feature-item-bg-2 { background-image: url('../images/project/icon_info_2.png'); } .project-feature-item-bg-3 { background-image: url('../images/project/icon_info_3.png'); } .project-feature-item-bg-4 { background-image: url('../images/project/icon_info_4.png'); } .table-item { float: left; width: 486px; height: 306px; } .table-item img { display: block; } .project-introduce-mobile-img { display: none; } .mb-text { display: none; } @media screen and (max-width: 768px) { .project-introduce-box { width: 100%; box-sizing: border-box; padding-left: 20px; float: none; padding-bottom: 0; } .project-introduce { padding: 0 20px; margin-top: 150px; padding-top: 20px; height: 500px; } .project-introduce-img { display: none; width: 90%; margin-top: -50px; margin-bottom: 20px; } .mb-text { display: block; } .project-introduce-mobile-img { display: block; width: 90%; margin: 0 auto; margin-top: -120px; margin-bottom: 20px; } .project-introduce h3 { font-size: 18px; } .project-introduce p { line-height: 30px; font-size: 12px; } .about-apply-title { font-size: 18px !important; } .project-list-item>div>h4 { font-size: 16px; margin-top: 15px; } .project-list-item>div>p { font-size: 14px; } .project-list-item { width: calc(50% - 20px); margin: 10px; } .project-feature { margin-top: 20px; } .project-feature-item { width: 100%; height: 158px; position: relative; } .project-feature-item h4 { font-size: 16px; margin: 20px 0 10px; } .project-table { width: 100% !important; } .project-feature-item p { line-height: 24px; font-size: 14px; } .project-table td { display: block; width: 100% !important; padding-bottom: 20px } .project-table td * { font-size: 14px !important; } .project-right { float: none !important; width: 100% !important; padding: 0 20px 20px; box-sizing: border-box; } .project-feature-item-bg-1:before { content: ""; width: 60px; height: 60px; position: absolute; left: -12px; top: -12px; display: block; background-image: url('../images/project/icon_mobile_1.png'); background-repeat: no-repeat; background-size: 100%; } .project-feature-item-bg-2:before { content: ""; width: 60px; height: 60px; position: absolute; right: -12px; top: -12px; display: block; background-image: url('../images/project/icon_mobile_2.png'); background-repeat: no-repeat; background-size: 100%; } .project-feature-item-bg-3:before { content: ""; width: 60px; height: 60px; position: absolute; left: -12px; top: -12px; display: block; background-image: url('../images/project/icon_mobile_3.png'); background-repeat: no-repeat; background-size: 100%; } .project-feature-item-bg-4:before { content: ""; width: 60px; height: 60px; position: absolute; right: -12px; top: -12px; display: block; background-image: url('../images/project/icon_mobile_4.png'); background-repeat: no-repeat; background-size: 100%; } .table-item { float: none; width: 100%; height: auto; padding-bottom: 10px; } .table-item p { zoom: .6; } .right_btn { background-color: transparent; margin-top: 0; } } /* 婊氬姩鍔ㄧ敾 */ .scroll-page .head { position: fixed; top: 0; width: 100%; left: 0; z-index: 11; } .scroll-page .banner { position: fixed; top: 160px; left: 0; width: 100%; z-index: 0; /* transition: top .3s; */ } .scroll-page .banner-content { top: -260px; } .scroll-page .scroll-wrap { padding-top:1020px; background-color: transparent; position: relative; z-index: 1; } .scroll-page .scroll-container { position: relative; background-color: #fff; } @media screen and (max-width: 768px) { .scroll-page .head { position: static; top: 0; width: 100%; left: 0; z-index: 11; } .scroll-page .banner { position: static; top: 200px; left: 0; width: 100%; z-index: 0; background-size: cover; /* transition: top .3s; */ } .scroll-page .banner-content { top: -108px; } .scroll-page .scroll-wrap { padding-top: 0px; } }