@import"common.css"; .swiper-container{ width: 100%; max-width: 1920px; min-width: 1239px; height: 500px; margin: 0 auto; } .swiper-slide { background-position: center; background-size: cover; } .tiexinfuwu{ width: 1239px; height: 70px; margin: 0 auto; background-color: #fff; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; } .tiexinfuwu>div{ width: auto; height: 46px; background: #ffffff; border: 1px solid #f2f2f2; box-shadow: 0px 4px 10px 0px rgba(137, 118, 93, 0.1); border-radius: 23px; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; padding-left: 20px; padding-right: 20px; max-width: 885px; overflow: hidden; } .tiexinfuwu>div:nth-child(1){ width: 842px; overflow: hidden; text-overflow: ellipsis; overflow: hidden; } .tiexinfuwu>div:nth-child(1)>div{ width: auto; height: 100%; background: #ffffff; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; overflow: hidden; font-size: 12px; } .tiexinfuwu>div:nth-child(1)>div:nth-child(1){ /* width: 108px !important; */ width: 0px !important; } .tiexinfuwu>div:nth-child(1)>div:nth-child(2){ /* width: 734px; */ width: 100%; } .tiexinfuwu>div:nth-child(1) a{ width: auto; height: 30px; background: #f5a43b; border-radius: 15px; padding-left: 14px; padding-right: 14px; margin-left: 14px; font-size: 14px; font-family: microsoft yahei; font-weight: bold; color: #ffffff; line-height: 30px; max-width: 100px; } .tiexinfuwu>div:nth-child(1) a:hover{ background: linear-gradient(0deg, #f5a43b, #ec8c0e); } .tiexinfuwu>div:nth-child(2){ height: 46px; background: #3db043; border-radius: 23px; } .tiexinfuwu>div:nth-child(2):hover{ background: linear-gradient(0deg, #3db043, #09f318); } .tiexinfuwu>div:nth-child(3){ height: 46px; border-radius: 23px; background: linear-gradient(0deg, #7431af, #5d248f); box-shadow: 0px 4px 10px 0px rgba(96, 38, 147, 0.16); } .tiexinfuwu>div:nth-child(3):hover{ background: linear-gradient(0deg, #5d248f, #7431af); } .tiexinfuwu>div:nth-child(2)a>,.tiexinfuwu>div:nth-child(3)a>{ width: auto; height: 46px; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; } .tiexinfuwu>div>a>img{ width: auto; height: 30px; } .tiexinfuwu>div>a>span{ font-size: 18px; font-family: microsoft yahei; font-weight: bold; color: #ffffff; } .youshi{ width: 100%; height: 248px; background-image: url(/uploads/image/sihome/home_a_bnt.png); background-repeat: no-repeat; background-size: 100% 100%; } .youshi>.content{ width: 1239px; height: 248px; margin: 0 auto; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; } .youshi>.content>div{ width: 173px; height: 173px; background: #fff; border-radius: 8px; } .youshi>.content>div>span:nth-child(1){ display: block; width: 100%; height: 24px; font-size: 24px; font-family: microsoft yahei; font-weight: bold; color: #5d248f; line-height: 24px; text-align: center; /*margin-top: 24px;*/ margin-top: 60px; } .youshi>.content>div>span:nth-child(2){ display: block; width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #333; line-height: 16px; margin-top: 19px; text-align: center; } .youshi>.content>div>a{ display: block; width: 128px; height: 34px; margin: 0 auto; background: #fff; border-radius: 17px; margin-top: 33px; border: 1px solid #fcaf4b; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #fcaf4b; line-height: 34px; text-align: center; } .youshi>.content>div:hover{ background: #5d248f; cursor:default; } .youshi>.content>div:hover>span:nth-child(1){ color: #ffffff; } .youshi>.content>div:hover>span:nth-child(2){ color: #ffffff; } .youshi>.content>div:hover>a{ color: #ffffff; background-color: #fcaf4b; } .shiyingrenqun{ width: 100%; background-color: #fff; } .shiyingrenqun>.content{ width: 1239px; margin: 0 auto; padding-top: 78px; padding-bottom: 78px; } .shiyingrenqun>.content>.title{ width: 100%; height: 37px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 37px; text-align: center; } .shiyingrenqun>.content>.des{ width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 16px; text-align: center; margin-top: 27px; } .shiyingrenqun>.content>.block{ width: 100%; height: 408px; background: #ffffff; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; margin-top: 100px; position: relative; } .shiyingrenqun>.content>.block>.spacing{ width: 310px; /* background-color: #333; */ } .shiyingrenqun>.content>.block>.spacing>.item{ width: 290px; height: 408px; margin: 0 auto; border: 1px solid #e6e6e6; position: relative; border-top: 5px solid #541b86; background-color: #fff; } .shiyingrenqun>.content>.block>.spacing>.item:hover{ width: 310px; height: 436px; border-top: 9px solid #541b86; /* 左 下 */ box-shadow: 1px 10px 20px 2px rgb(233, 230, 230); z-index: 9; } .shiyingrenqun>.content>.block>.spacing>.item>.item_title{ width: 85%; height: 18px; margin: 0 auto; font-size: 18px; font-family: microsoft yahei; font-weight: bold; color: #541b86; line-height: 18px; margin-top: 49px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .shiyingrenqun>.content>.block>.spacing>.item>.item_des{ width: 85%; /* height: 14px; */ margin: 0 auto; font-size: 14px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 18px; margin-top: 20px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .shiyingrenqun>.content>.block>.spacing>.item>.item_li{ width: 85%; height: auto; margin: 0 auto; margin-top: 40px; } .shiyingrenqun>.content>.block>.spacing>.item>.item_li>p{ width: 100%; height: 16px; display: flex; align-items: center; flex-direction: row; justify-content: flex-start; flex-wrap: nowrap; margin-top: 25px; } .shiyingrenqun>.content>.block>.spacing>.item>.item_li>p>img{ width: auto; height: 16px; } .shiyingrenqun>.content>.block>.spacing>.item>.item_li>p>span{ height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 16px; margin-left: 14px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .yingeryoushi{ width: 100%; /*height: 1136px;*/ background: #f0f0f0; } .yingeryoushi>.content{ width: 1239px; margin: 0 auto; padding-top: 60px; padding-bottom: 60px; } .yingeryoushi>.content>.title{ width: 100%; height: 37px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 37px; text-align: center; } .yingeryoushi>.content>.des{ width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 16px; text-align: center; margin-top: 27px; } .yingeryoushi>.content>.button{ display: block; width: 168px; height: 46px; background: #f5a43b; margin: 0 auto; box-shadow: 0px 4px 10px 0px rgba(245, 164, 59, 0.36); border-radius: 23px; margin-top: 29px; font-size: 16px; font-family: microsoft yahei; font-weight: bold; color: #ffffff; line-height: 46px; text-align: center; } .yingeryoushi>.content>.button:hover{ background: #f5a43b; box-shadow: 0px 4px 10px 0px rgba(245, 164, 59, 0.36); background: linear-gradient(0deg, #f5a43b, #f08d0b); } .yingeryoushi>.content>.block{ width: 100%; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; margin-top: 41px; position: relative; } .yingeryoushi>.content>.block>.dashijian{ width: 460px; height: 788px; background-image: url(/uploads/image/sihome/home_c_bnt.png); background-repeat: no-repeat; background-size: 100% 100%; background-position: center; overflow: hidden; } .yingeryoushi>.content>.block>.dashijian>.dashijian_title{ width: 386px; height: 36px; margin: 0 auto; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #ffffff; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; margin-top: 41px; /* margin-bottom: 60px; */ } .yingeryoushi>.content>.block>.dashijian>.dashijian_title>span{ height: 36px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #ffffff; line-height: 36px; } .yingeryoushi>.content>.block>.dashijian>.dashijian_title>a{ height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #ffffff; } .yingeryoushi>.content>.block>.dashijian>.dashijian_title>a:hover{ color: #f5a43b; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content{ padding-top: 20px; margin-top: 40px; width: 460px; height: 622px; overflow: scroll; overflow-x: hidden; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row{ width: 360px; height: auto; margin: 0 auto; padding-top: 24px; padding-bottom: 24px; border-left: 2px solid #fff; padding-left: 30px; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row>.title{ width: 100%; height: 20px; font-size: 20px; font-family: microsoft yahei; font-weight: bold; color: #ffb14c; line-height: 20px; position: relative; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row>.title>span{ width: 8px; height: 8px; background: #ffffff; border-radius: 50%; position: absolute; top: 6px; left: -35px; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row>.title>img{ width: 30px; height: 30px; position: absolute; top: -8px; left: -30px; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row>.des{ width: 100%; font-size: 14px; font-family: microsoft yahei; font-weight: 400; color: #ffffff; line-height: 20px; margin-top: 6px; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row_null{ padding: 0; border-left: none; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row_null>.title>img{ width: 30px; height: 30px; position: absolute; top: -8px; left: -30px; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row_null2{ padding: 0; border-left: none; padding-bottom: 30px; } .yingeryoushi>.content>.block>.dashijian>.dashijian_content>.row_null2>.title>img{ width: 30px; height: 30px; position: absolute; top: -2px; left: -30px; } .yingeryoushi>.content>.block>.item{ width: 244px; height: 788px; /* display: flex; align-items: center; flex-direction: row; justify-content: stretch; flex-wrap: wrap; */ } .yingeryoushi>.content>.block>.item>div{ width: 244px; height: 383px; background: #ffffff; } .yingeryoushi>.content>.block>.item>div:nth-child(2){ margin-top: 22px; } .yingeryoushi>.content>.block>.item>div>img{ display: block; width: 155px; height: 117px; margin: 0 auto; padding-top: 52px; /* transform: rotatez(90deg); */ } .yingeryoushi>.content>.block>.item>div:hover>img{ animation:item_img 800ms linear; } @keyframes item_img{ form{transform:rotatey(0deg);} to{transform:rotatey(360deg);} } .yingeryoushi>.content>.block>.item>div>span{ display: block; width: 90%; height: 18px; margin: 0 auto; font-size: 18px; font-family: microsoft yahei; font-weight: bold; color: #000000; line-height: 18px; margin-top: 28px; text-align: center; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .yingeryoushi>.content>.block>.item>div>p{ display: block; width: 90%; /* height: 62px; */ margin: 0 auto; font-size: 14px; font-family: microsoft yahei; font-weight: 400; color: #999999; margin-top: 31px; text-align: justify; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .shiguanyingerfeiyong{ width: 100%; height: 480px; background: #fff; overflow: hidden; } .shiguanyingerfeiyong>.content{ width: 1239px; margin: 0 auto; padding-top: 60px; padding-bottom: 60px; } .shiguanyingerfeiyong>.content>.title{ width: 100%; height: 37px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 37px; text-align: center; } .shiguanyingerfeiyong>.content>.des{ width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 16px; text-align: center; margin-top: 27px; } .shiguanyingerfeiyong>.content>.block{ width: 100%; height: auto; margin-top: 60px; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; } .shiguanyingerfeiyong>.content>.block>.item{ width: 224px; height: auto; text-align: center; } .shiguanyingerfeiyong>.content>.block>.item>img{ width: 108px; height: 108px; } .shiguanyingerfeiyong>.content>.block>.item>span{ display: block; width: 100%; height: 18px; font-size: 18px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 18px; margin-top: 20px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .shiguanyingerfeiyong>.content>.block>.item>p{ width: 100%; /* height: 14px; */ font-size: 14px; font-family: microsoft yahei; font-weight: 400; color: #999999; margin-top: 19px; text-align: justify; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .shiguanyingerfeiyong>.content>.block>.item:hover>img{ animation:item2_hover 500ms linear; } @keyframes item2_hover{ form{transform:rotate(0deg);} to{transform:rotate(360deg);} } .shiguanyingerliucheng{ width: 100%; /*height: 830px;*/ background-image: url(/uploads/image/sihome/home_e_bnt_bj.png); background-repeat: no-repeat; background-size: 100% 100%; } .shiguanyingerliucheng>.content{ width: 1239px; margin: 0 auto; padding-top: 60px; padding-bottom: 60px; } .shiguanyingerliucheng>.content>.title{ width: 100%; height: 37px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 37px; text-align: center; } .shiguanyingerliucheng>.content>.des{ width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 16px; text-align: center; margin-top: 27px; } .shiguanyingerliucheng>.content>.select{ width: 1240px; height: 60px; background: #ffffff; margin-top: 62px; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; } .shiguanyingerliucheng>.content>.select>.item{ width: 155px; height: 60px; /* background: #f5a43b; */ font-size: 16px; font-family: microsoft yahei; font-weight: 400; /* color: #ffffff; */ color: #333333; line-height: 60px; cursor: pointer; } .shiguanyingerliucheng>.content>.select>.item>span{ display: inline-block; width: 26px; height: 26px; /* background: #ffffff; */ background: #e6e6e6; border-radius: 50%; font-size: 14px; font-family: microsoft yahei; font-weight: bold; color: #666666; /* color: #f5a43b; */ line-height: 26px; text-align: center; margin-left: 25px; margin-right: 14px; } .shiguanyingerliucheng>.content>.select>.item:hover{ background: #f5a43b; color: #ffffff; } .shiguanyingerliucheng>.content>.select>.item:hover>span{ background: #ffffff; color: #f5a43b; } .shiguanyingerliucheng>.content>.select>.item.active{ background: #f5a43b; color: #ffffff; } .shiguanyingerliucheng>.content>.select>.item.active>span{ background: #ffffff; color: #f5a43b; } .shiguanyingerliucheng>.content>.select_content{ width: 1240px; height: 400px; background: #ffffff; margin-top: 20px; /* display: flex; align-items: center; flex-direction: row; justify-content: flex-start; flex-wrap: nowrap; overflow: hidden; */ overflow: hidden; } .shiguanyingerliucheng>.content>.select_content>.item{ width: 1240px; height: 400px; background: #ffffff; display: flex; align-items: center; flex-direction: row; justify-content: flex-start; flex-wrap: nowrap; /* display: none; */ } .shiguanyingerliucheng>.content>.select_content>.item:nth-child(1){ /* display: flex; */ } .shiguanyingerliucheng>.content>.select_content>.item>img{ width: 318px; height: 312px; margin-left: 44px; } .shiguanyingerliucheng>.content>.select_content>.item>div{ width: 800px; height: 400px; background-color: #fff; margin-left: 41px; } .shiguanyingerliucheng>.content>.select_content>.item>div>.title{ display: block; width: 100%; height: 25px; font-size: 24px; font-family: microsoft yahei; font-weight: 400; color: #5d248f; line-height: 25px; text-align: left; padding-top: 83px; } .shiguanyingerliucheng>.content>.select_content>.item>div>.hr1{ width: 12.5%; height: 1px; background: #5d248f; margin-top: 29px; } .shiguanyingerliucheng>.content>.select_content>.item>div>.hr2{ width: 800px; height: 1px; background: #e6e6e6; } .shiguanyingerliucheng>.content>.select_content>.item>div>.des{ width: 100%; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #333333; margin-top: 40px; text-align: justify; line-height: 30px; } .shiguanyingerliucheng>.content>.select_content>.item>div>.next{ width: 100%; height: 30px; background: #ffffff; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; margin-top: 30px; } .shiguanyingerliucheng>.content>.select_content>.item>div>.next>img{ width: 34px; height: auto; cursor: pointer; } .shiguanyingerliucheng>.content>.bottom{ display: block; width: 168px; height: 46px; background: #f5a43b; box-shadow: 0px 4px 10px 0px rgba(245, 164, 59, 0.36); border-radius: 23px; margin: 0 auto; margin-top: 32px; font-size: 16px; font-family: microsoft yahei; font-weight: bold; color: #ffffff; line-height: 46px; text-align: center; } .shiguanyingerliucheng>.content>.bottom:hover{ background: #f5a43b; box-shadow: 0px 4px 10px 0px rgba(245, 164, 59, 0.36); background: linear-gradient(0deg, #f5a43b, #f08d0b); } .shiguanyingerchenggonganli{ width: 100%; height: auto; background: #ffffff; } .shiguanyingerchenggonganli>.content{ width: 1239px; margin: 0 auto; padding-top: 60px; padding-bottom: 60px; } .shiguanyingerchenggonganli>.content>.title{ width: 100%; height: 37px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 37px; text-align: center; } .shiguanyingerchenggonganli>.content>.des{ width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 16px; text-align: center; margin-top: 27px; } .shiguanyingerchenggonganli>.content>.button{ display: block; width: 168px; height: 46px; background: rgba(245, 164, 59, 0.05); border: 1px solid #ffb14c; border-radius: 23px; margin: 0 auto; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #f5a43b; line-height: 46px; text-align: center; margin-top: 31px; } .shiguanyingerchenggonganli>.content>.button:hover{ background: #f5a43b; border: 1px solid #f5a43b; color: #ffffff; } .shiguanyingerchenggonganli>.content>.block{ width: 100%; height: auto; display: flex; align-items: center; flex-direction: row; justify-content: start; flex-wrap: wrap; } .shiguanyingerchenggonganli>.content>.block>.item{ display: block; width: 373px; height: auto; /* flex: 3; */ margin-top: 34px; margin-right: 52px; } .shiguanyingerchenggonganli>.content>.block>.item:hover>.img>img{ transform: scale(1.1); } .shiguanyingerchenggonganli>.content>.block>.item:nth-child(3n){ margin-right: 0; } .shiguanyingerchenggonganli>.content>.block>.item>.img{ width: 373px; height: 280px; border: 6px solid #efefef; border-radius: 8px; background: #ffffff; text-align: center; overflow: hidden; /* box-shadow: 1px 10px 20px 2px rgb(196, 192, 192); */ /* box-shadow: 0px -15px 2px -15px rgb(133 127 127); */ } .shiguanyingerchenggonganli>.content>.block>.item>.img>img{ display: block; width: 373px; height: 100%; object-fit: cover; margin: 0 auto; } .shiguanyingerchenggonganli>.content>.block>.item>span{ display: block; width: 100%; height: 18px; font-size: 18px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 18px; margin-top: 30px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .shiguanyingerchenggonganli>.content>.block>.item>p{ display: block; width: 100%; height: 39px; font-size: 14px; font-family: microsoft yahei; font-weight: 400; color: #999999; text-align: justify; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; margin-top: 20px; } .shiguanyingerchenggonganli>.content>.block>.item:hover>span{ color: #f5a43b; } .guanyuchuanchengjituan{ width: 100%; height: 800px; background: #ffffff; } .guanyuchuanchengjituan>.heise{ width: 100%; height: 304px; background: #332f37; } .guanyuchuanchengjituan>.tongji{ width: 1239px; height: 220px; margin: 0 auto; margin-top: 267px; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: wrap; /* background-color: #f00; */ } .guanyuchuanchengjituan>.tongji>.item{ width: 20%; height: 92px; } .guanyuchuanchengjituan>.tongji>.item>div{ width: 100%; height: 50px; font-size: 50px; font-family: microsoft yahei; font-weight: bold; color: #5d248f; line-height: 50px; text-align: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .guanyuchuanchengjituan>.tongji>.item>div>.n{ /* display:inline-block; */ /* height: 50px; */ font-size: 50px; font-family: microsoft yahei; font-weight: bold; color: #5d248f; } .guanyuchuanchengjituan>.tongji>.item>div>.n_{ display: inline-block; width: 18px; height: 18px; font-size: 18px; font-family: microsoft yahei; font-weight: 400; color: #5d248f; line-height: 18px; position: relative; top: -20px; padding-left: 10px; } .guanyuchuanchengjituan>.tongji>.item>p{ width: 100%; height: 18px; font-size: 18px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 18px; margin-top: 24px; text-align: center; } .guanyuchuanchengjituan>.position{ width: 1239px; height: 1px; margin: 0 auto; position: relative; } .guanyuchuanchengjituan>.position>div{ position: absolute; width: 1239px; height: 496px; background: #f5a43b; right: 0; top: -228px; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; } .guanyuchuanchengjituan>.position>div>div{ width: 50%; height: 496px; } .guanyuchuanchengjituan>.position>div>div>.title{ /* width: 100%; */ height: 36px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #ffffff; line-height: 36px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-top: 40px; text-align: left; padding-left: 20px; padding-right: 43px; } .guanyuchuanchengjituan>.position>div>div>.key{ /* width: 100%; */ height: 24px; font-size: 24px; font-family: microsoft yahei; font-weight: 400; color: #ffffff; line-height: 24px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; text-align: left; margin-top: 28px; padding-left: 20px; padding-right: 43px; } .guanyuchuanchengjituan>.position>div>div>.des{ /* width: 100%; */ font-size: 14px; font-family: microsoft yahei; font-weight: 400; color: #ffffff; line-height: 36px; text-align: justify; margin-top: 41px; display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; margin-top: 20px; padding-left: 20px; padding-right: 43px; } .guanyuchuanchengjituan>.position>div>div>img{ width: 90%; position: relative; left: 30px; top: -20px; } .shipinzhishi{ width: 100%; height: 752px; background: #f5f5f5; } .shipinzhishi>.content{ width: 1239px; margin: 0 auto; padding-top: 60px; padding-bottom: 60px; } .shipinzhishi>.content>.title{ width: 100%; height: 37px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 37px; text-align: center; } .shipinzhishi>.content>.des{ width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 16px; text-align: center; margin-top: 27px; } .shipinzhishi>.content>.block{ width: 100%; display: flex; align-items: center; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; margin-top: 60px; overflow: hidden; } .shipinzhishi>.content>.block>.item{ display: block; width: 298px; height: 330px; } .shipinzhishi>.content>.block>.item>.img{ width: 298px; height: 290px; text-align: center; overflow: hidden; position: relative; } .shipinzhishi>.content>.block>.item>.img>img:nth-child(1){ width: 298px; height: 100%; object-fit: cover; } .shipinzhishi>.content>.block>.item>.img>img:nth-child(2){ width: 46px; height: 46px; position: relative; top: -55%; } .shipinzhishi>.content>.block>.item>.title{ display: block; width: 100%; height: 14px; font-size: 14px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 14px; margin-top: 18px; text-align: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .shipinzhishi>.content>.block>.item:nth-child(2){ width: 570px; height: 391px; } .shipinzhishi>.content>.block>.item:nth-child(2)>.img{ width: 570px; height: 351px; text-align: center; overflow: hidden; } .shipinzhishi>.content>.block>.item:nth-child(2)>.img>img:nth-child(1){ width: 570px; height: 100%; object-fit: cover; } .shipinzhishi>.content>.block>.item:nth-child(2)>.img>img:nth-child(2){ width: 46px; height: 46px; position: relative; /* top: -83%; */ } .shipinzhishi>.content>.block>.item:hover>.title{ color: #f5a43b; } .shipinzhishi>.content>.block>.item:hover>.img{ opacity: 0.8; } .shipinzhishi>.content>.block>.item:hover>.img>img:nth-child(2){ animation:icon_hover 300ms linear; } @keyframes icon_hover{ form{transform:rotate(0deg);} to{transform:rotate(360deg);} } .shipinzhishi>.content>.button{ display: block; width: 168px; height: 46px; margin: 0 auto; background: rgba(245, 164, 59, 0.05); border: 1px solid #ffb14c; border-radius: 23px; margin-top: 58px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #f5a43b; line-height: 46px; text-align: center; } .hezuoyiyuan{ width: 100%; background: #fff; background-image: url(/uploads/image/sihome/home_hzyy1.png); background-repeat: no-repeat; background-size: 100% auto; background-position: left bottom; padding-top: 30px; padding-bottom: 80px; } .hezuoyiyuan>.content{ width: 1239px; margin: 0 auto; } .hezuoyiyuan>.content>.title{ width: 100%; height: 37px; font-size: 36px; font-family: microsoft yahei; font-weight: 400; color: #333333; line-height: 37px; text-align: center; } .hezuoyiyuan>.content>.des{ width: 100%; height: 16px; font-size: 16px; font-family: microsoft yahei; font-weight: 400; color: #999999; line-height: 16px; text-align: center; margin-top: 27px; } .hezuoyiyuan>.content>.block{ width: 100%; display: flex; align-items: start; flex-direction: row; justify-content: space-between; flex-wrap: nowrap; margin-top: 72px; } .hezuoyiyuan>.content>.block>img{ width: 100%; height: auto; }