body { background-color: #f1f1f1; position: relative; } .toutu_box { background: no-repeat; background-size: 100% auto; background-position: center top; } /* banner开始 */ .banner { position: relative; width: 100%; height: 700px; margin: 0 auto 40px; overflow: hidden; } .banner .tab_box { position: absolute; top: 0; width: 100%; height: 57px; background-color: rgba(255, 255, 255, .6); backdrop-filter: blur(5px); z-index: 9999; } .banner .tab_box ul {width:1200px;margin:0px auto;} .banner .tab_box li { float: left; height: 57px; width:171px; text-align:center; position: relative; } .banner .tab_box li>a { display: block; font-size: 18px; line-height: 57px; } .banner .tab_box .active { background-color: #fff; opacity:.8; } .banner .tab_box li .card_bg { width: 1200px; position: absolute; top: 57px; display: none; background-color:#f00; } .banner .tab_box li .card { position: absolute; top: 57px; box-sizing: border-box; padding:30px 0px; width: 1026px; height: auto; background-color: rgba(255, 255, 255,0.9); display: none; z-index:99; } .banner .tab_box li .card .lef{ float:left; width:150px; line-height:26px; border-right: 1px solid #999; height: 155px; padding: 0px 20px; box-sizing: border-box; } .banner .tab_box li .card .lef a { color:#015942; } .banner .tab_box li .card .lef a:hover { color:#008965; } .banner .tab_box li .card .lef img { width:230px; } .banner .tab_box li .card .lef h4 { font-size:14px; line-height: 21px; } .banner .tab_box li .card .lef p { font-size:14px; line-height: 21px; text-align: justify; text-indent:24px; } .banner .tab_box li .card .lef .lef_main{ overflow:hidden; } .banner .tab_box li .card .lef .lef_main .img{ float:left; width:120px; } .banner .tab_box li .card .lef .lef_main .card_info { -webkit-line-clamp: 7; } .banner .tab_box li .card .lef .lef_main_img{ float:left; padding: 0px 20px; box-sizing: border-box; } .banner .tab_box li .card .lef .lef_navmenu { display: flex; justify-content: center; text-align: center; margin-top:10px; } .banner .tab_box li .card .lef .lef_navmenu .li { width: 20%; font-size: 14px; --text-opacity: 1; color: #4a5568; color: rgba(74,85,104,var(--text-opacity)); border-right-width: 1px; --border-opacity: 1; border-color: #cbd5e0; border-color: rgba(203,213,224,var(--border-opacity)); } .banner .tab_box li .card .lef .lef_navmenu .li i { display: block; font-size: 40px; --transform-translate-x: 0; --transform-translate-y: 0; --transform-rotate: 0; --transform-skew-x: 0; --transform-skew-y: 0; --transform-scale-x: 1; --transform-scale-y: 1; transform: translatex(var(--transform-translate-x)) translatey(var(--transform-translate-y)) rotate(var(--transform-rotate)) skewx(var(--transform-skew-x)) skewy(var(--transform-skew-y)) scalex(var(--transform-scale-x)) scaley(var(--transform-scale-y)); transition-duration: .1s; line-height: 2; } .banner .tab_box li .card .lef .lef_navmenu .li:hover i { --transform-scale-x: 1.25; --transform-scale-y: 1.25; } .banner .tab_box li .card .midd { justify-content: center; text-align: center; width:154px; height: 155px; float: left; border-right: 1px solid #999; } .banner .tab_box li .card .midd img { width:55px; margin:19px auto; transition: .1s ease; } .banner .tab_box li .card .midd img:hover { transform: scale(1.2); transition: .1s ease; } .banner .tab_box li .card .midd p { font-size: 14px; color:#015942; } .banner .tab_box li .card .midd p:hover { color: #008965; } .banner .tab_box li .card .left { border-right: 1px solid #999; width: 171px; height: 155px; text-align:center; } .banner .tab_box li .card .left a { display: block; color: #015942; font-size: 14px; line-height:26px; } .banner .tab_box li .card .left a:hover { color: #000; } .banner .tab_box li .card .right { width: 400px; height: 100px; padding: 0 0 0 30px; transform-style: preserve-3d; transition-duration: .5s; } .banner .tab_box li .card .right .img { float: left; } .banner .tab_box li .card .right img { width: 240px; height: 140px; vertical-align: bottom; } .banner .tab_box li .card .righ { float:left; width: 150px; height: 155px; text-align:center; font-size: 14px; line-height: 26px; } .banner .tab_box li .card .righ a { display: block; color: #015942; font-size: 14px; line-height: 26px; } .banner .tab_box li .card .righ a:hover { color: #000; } .card_main { position: absolute; display: none; clear: both; width: 100%; } .banner .tab_box li .card .card_main:nth-child(1) { display: block; transform: translatex(0) translatez(85px); } .banner .tab_box li .card .card_main:nth-child(2) { transform: rotatex(60deg) translatez(85px); } .banner .tab_box li .card .card_main:nth-child(3) { transform: rotatex(120deg) translatez(85px); } .banner .tab_box li .card .card_main:nth-child(4) { transform: rotatex(180deg) translatez(85px); } .banner .tab_box li .card .card_main:nth-child(5) { transform: rotatex(240deg) translatez(85px); } .banner .tab_box li .card .card_main:nth-child(6) { transform: rotatex(300deg) translatez(85px); } .card_info { float: left; width: 330px; padding-left: 20px; font-size: 14px; line-height: 25px; word-break:break-all; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; text-align:left; } .card_info h4 {font-size:14px;line-height:30px;} .card_info a {color:#015942;} .card_info a:hover {color:#008965;} /* banner轮播 */ .banner .swiper { height:700px; } .banner .swiper .swiper-slide { background-position:center top; background-repeat:no-repeat; text-align: center; cursor:pointer; } .banner .swiper .swiper-slide img { height:700px; } @media screen and (max-width: 1920px) { .banner {height: 700px;} .banner .swiper {height:700px;} .banner .swiper .swiper-slide img {height:700px;} } @media screen and (max-width: 1366px) { .banner {height: 498px;} .banner .swiper {height:498px;} .banner .swiper .swiper-slide img {height:498px;} } /* 滚动公告 */ .scroll_news { position: absolute; bottom: 0; left: 50%; transform: translatex(-50%); z-index: 999; height: 50px; } .qian { background-color: #0b7757; width: 134px; height: 50px; line-height: 50px; text-align: center; color: #fff; } .qian img, .qian p { display: inline-block; vertical-align: middle; cursor: context-menu; } .scroll-left { float: left; width: 1066px; line-height: 50px; background-color: rgba(205, 212, 205, .8); } .scroll-left .bd { float: left; width: 980px; overflow: hidden; } .scroll-left li { margin-right: 30px; float: left; text-align: left; _display: inline; width: auto !important; } .scroll-left .more { display: block; float: right; width: 66px; } .scroll-left .bd .tempwrap { width: 980px !important; } /* toutiao */ .toutiao { background-color: #fff; padding: 30px; margin-bottom: 40px; line-height: 50px; font-size: 36px; font-weight: 800; text-align: center; /*font-family: 'fzzhunysk';*/ } .toutiao a { display: block; /*width: 725px;*/ margin: 0 auto; color: #db1717; /*font-family: 'fzzhunysk';*/ } /*.toutiao {*/ /* background-color: #fff;*/ /* padding: 30px 0;*/ /* margin-bottom: 40px;*/ /* line-height: 50px;*/ /* font-size: 28px;*/ /* font-weight: 600;*/ /* text-align: center;*/ /* font-family: 'fzzhunysk';*/ /*}*/ /*.toutiao a {*/ /* display: block;*/ /* width: 725px;*/ /* margin: 0 auto;*/ /* color:#db1717;*/ /* font-family: 'fzzhunysk';*/ /*}*/ /* 动态 */ .dt { background-color: #fff; margin-bottom: 40px; } .dt .slidebox1 { position: relative; width: 710px; height: 430px; overflow: hidden; } .dt .slidebox1 .bd { height: 100%; } .dt .slidebox1 img { width: 710px; height: 430px; vertical-align: bottom; } .slidebox1 .bd .shadow { box-sizing: border-box; position: absolute; bottom: 0; padding: 20px 30px; width: 710px; height: 60px; background: #000; background: rgba(0, 0, 0, .5); color: #fff; } .slidebox1 .bd .shadow p { text-align: center; font-size: 22px; line-height: 26px; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } .slidebox1 .hd { position: absolute; bottom: 20px; right: -10px; transform: translatex(-50%); z-index: 999; } .slidebox1 .hd li { float: left; width: 9px; height: 9px; border-radius: 50%; background-color: #fff; margin: 3px; } .slidebox1 .hd li:last-child { margin-right: 0; } .slidebox1 .hd li.on { background-color: #f9bf04; } #slidebox1 .prev { box-sizing: border-box; position: absolute; z-index: 2; top: 50%; left: 20px; transform: translatey(-50%); width: 53px; color: rgb(255, 255, 255); cursor: pointer; height:71px; background: url(/uploads/image/rimg/left.png) center center no-repeat; border-radius: 10px; opacity: 0.5; } #slidebox1 .next { box-sizing: border-box; position: absolute; z-index: 2; top: 50%; right: 20px; transform: translatey(-50%); width: 53px; cursor: pointer; height:71px; background: url(/uploads/image/rimg/right.png) center center no-repeat; border-radius: 10px; opacity: 0.5; } /*公告公示*/ .gggs { margin-top: 40px; margin-bottom: 40px; } .gggs .gonggao_l { display: inline-block; width: 715px; height: 256px; background: url(/uploads/image/rimg/gggs_bg.png) center top no-repeat; box-sizing: border-box; } .gggs .gonggao_l .gggs_bg { display: inline-block; width: 70px; /*2023-0805-修改*/ height:256px; /*background: center 46px no-repeat;*/ /*修改结束*/ } /*2023-1214-修改*/ .gggs .gonggao_l .gggs_bg .bd { display: inline-block; width: 645px; margin-left: 12px; margin-top: 24px; overflow:hidden; } .gggs .gonggao_l .con { height:256px; margin: 0px 17px; } /*修改结束*/ /*源代码*/ /*.gggs .gonggao_l .con {*/ /*2023-0805-修改*/ /*height:256px;*/ /*background: center 46px no-repeat;*/ /*修改结束*/ /*margin: 30px 17px;*/ /*padding-left: 50px;*/ /*background: left 16px no-repeat;*/ /*}*/ /*.gggs .gonggao_l .gggs_bg .bd { display: inline-block; width: 645px; margin-left: 12px; margin-top: 24px; }*/ /*源代码结束*/ .gggs .gonggao_l .con li { padding-left: 35px; padding-right: 35px; height: 50px; line-height: 50px; background: url(/uploads/image/rimg/laba.png) left center no-repeat; } .gggs .gonggao_l .con li img { float: right; transform: translatey(18px); } .gggs .gonggao_r { float:right; display: inline-block; vertical-align: bottom; width: 438px; height: 256px; background: #fff; box-sizing: border-box; } .gggs .gonggao_r a { display: inline-block; float:left; width: 33.3%; height: 127px; background-size: 100%; transition: .3s; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; box-sizing: border-box; } .gggs .gonggao_r a:nth-child(3), .gggs .gonggao_r a:nth-child(6) { width: 33.4%; border-right: none; } .gggs .gonggao_r a:nth-child(4), .gggs .gonggao_r a:nth-child(5), .gggs .gonggao_r a:nth-child(6) { border-bottom: none; height: 128px; } .gggs .gonggao_r .icon1 { background: center 10px no-repeat; } .gggs .gonggao_r .icon1:hover { background: #1fc99c url(/uploads/image/rimg/icon1-hover.png) center 10px no-repeat; } .gggs .gonggao_r .icon2 { background: url(/uploads/image/rimg/icon2-link.png) center center no-repeat; } .gggs .gonggao_r .icon2:hover { background: #1fc99c url(/uploads/image/rimg/icon2-hover.png) center center no-repeat; } .gggs .gonggao_r .icon3 { background: url(/uploads/image/rimg/icon3-link.png) center center no-repeat; } .gggs .gonggao_r .icon3:hover { background: #1fc99c url(/uploads/image/rimg/icon3-hover.png) center center no-repeat; } .gggs .gonggao_r .icon4 { background: center center no-repeat; } .gggs .gonggao_r .icon4:hover { background: #1fc99c url(/uploads/image/rimg/icon4-hover.png) center center no-repeat; } .gggs .gonggao_r .icon5 { background: url(/uploads/image/rimg/icon5-link.png) center center no-repeat; } .gggs .gonggao_r .icon5:hover { background: #1fc99c url(/uploads/image/rimg/icon5-hover.png) center center no-repeat; } .gggs .gonggao_r .icon6 { background: url(/uploads/image/rimg/icon6-link.png) center center no-repeat; } .gggs .gonggao_r .icon6:hover { background: #1fc99c url(/uploads/image/rimg/icon6-hover.png) center center no-repeat; } .dt .msgmail { width: 460px; padding-left: 30px; } .msgmail .title a { font-size: 18px; line-height: 40px; position: relative; display: inline-block; font-weight: bold; } .msgmail .title span { font-size: 22px; line-height: 50px; font-style: italic; color: #008965; } .msgmail .title span:last-child { color: #fabf14; } .msgmail .title { height: 50px; line-height: 50px; border-bottom: 1px solid #eee; } .msgmail .new_list { line-height: 45px; font-size: 18px; } .msgmail .new_list li:nth-child(1) { font-weight: 600; } .msgmail .new_list li { position: relative; padding-right: 27px; height: 45px; } .msgmail .new_list li a { position: relative; display: inline-block; white-space: nowrap; overflow: hidden; } .msgmail .new_list li img { /*position: absolute;*/ /*!*right: 0;*!*/ /*top: 50%;*/ /*display: inline-block;*/ /*transform: translatey(-160%);*/ float: right; transform: translatey(18px); } /*手风琴*/ .accordion { position: relative; width: 1200px; margin: 0 auto; height: 400px; zoom: 1; } .accordion .zhuantitit { color: #008965; font-style: italic; height: 50px; line-height: 40px; font-size: 22px; font-weight: 700; border-top: 2px solid rgba(0, 156, 132, 0.3); } .accordion ul { width: 1200px; overflow: hidden; height: 340px; position: relative; } .accordion ul li { left: 0px; top: 0px; overflow: hidden; zoom: 1; position: absolute; width: 665px; height: 340px; } .accordion ul li .num { cursor: pointer; position: absolute; left: 0; width: 107px; line-height: 1.1; letter-spacing: 0; height: 100%; z-index: 9999; display:none; } .accordion ul li .num p { writing-mode: tb; color: #fff; font-size: 18px; width: 18px; margin: 0 auto; display: inline-block; position: absolute; top: 30px; left: 50%; transform: translatex(-50%); } .accordion ul li .description { position: absolute; left: 0; top: 0; width: 665px; height: 340px; z-index: 9; } .accordion ul li .description img { width: 100%; height: 100%; } .accordion ul li .description .tit { position: absolute; bottom: 0; left: 0; right: 0; width: 100%; padding: 20px; padding-left: 90px; box-sizing: border-box; background: black; background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0)); } .accordion ul li .description .tit h2 { font-size: 18px; font-weight: bold; color: #fff; } .accordion ul li .description .tit p { font-size: 14px; color: #fff; } .current { display: none; } .accordion .zhuantitit a span { display: inline-block; border-top: 2px solid rgba(0, 137, 101); transform: translatey(-2px); color: #008965; } .accordion .zhuantitit a span:last-child { color: #fabf14; } /* 企业简介 */ .qyjj { height: 425px; padding: 60px 0; margin-bottom: 40px; background-color: #fff; } .tabbox { float: left; } .tab { position: relative; width: 56px; height: 151px; cursor: pointer; } .tab img { width: 56px; height: 151px; } .tab1 { margin-bottom: 3px; } .tab p { color: #fff; font-size: 18px; width: 18px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .tab_card { box-sizing: border-box; float: left; padding: 100px 40px 0 50px; width: 555px; height: 305px; background: url(/uploads/image/rimg/logo.jpg) center top no-repeat; font-size: 14px; line-height: 35px; } .tab_card_box { display: none; } .tab_card_box:nth-child(2) { display: block; } .tab_card_box img { float: left; width: 589px; height: 305px; } /* 公益广告 */ .gygg { box-sizing: border-box; width: 100%; height: 450px; background: center bottom no-repeat; padding: 40px 0 0 0; } .gygg .toptit { width: 220px; height: 70px; transform: translatex(-50%); margin-left: 50%; margin-bottom: 30px; } .gygg_w { width: 1200px; margin: 0 auto; } .picscroll_left .bd { position: relative; width: 1030px; margin: 0 auto; } .picscroll_left .bd .img_box { float: left; width: 186px; height: 262px; margin: 0 10px; } .picscroll_left .bd li { position: relative; float: left; /*overflow: hidden;*/ width: 206px; height: 262px; transition: .2s ease; } .picscroll_left .bd li a { position: absolute; top: 0; left: 0; display: block; } .picscroll_left .bd li .img_box img { width: 186px; height: 262px; vertical-align: bottom; transition: .2s ease; } .picscroll_left .bd li p { position: absolute; bottom: -262px; /*float: left;*/ width: 206px; height: 262px; /*padding: 10px 20px;*/ color: #fff; font-size: 16px; line-height: 24px; transition: .2s ease; box-sizing: border-box; } .picscroll_left .bd li p span { display: block; position: absolute; bottom: 10px; width: 186px; left: 10px; } .picscroll_left .bd li:hover a .img_box img { transform: scale(1.1); transition: .2s ease; } .picscroll_left .bd .prev, .picscroll_left .bd .next { box-sizing: border-box; display: block; position: absolute; z-index: 2; top: 50%; width: 53px; transform: translatey(-50%); cursor: pointer; height:71px; } .picscroll_left .bd .prev { left: -50px; background: url(/uploads/image/rimg/left.png) center center no-repeat; } .picscroll_left .bd .next { right: -50px; background: url(/uploads/image/rimg/right.png) center center no-repeat; } /* 新闻 */ .news { margin-bottom: 40px; } .news_box { width: 360px; height: 485px; padding: 15px 13px 0 17px; margin-right: 15px; float: left; background-color: #fff; } .news_box:nth-child(3n) { margin-right: 0; } .news_box .icon { width: 130px; height: 40px; margin-bottom: 14px; } .news_box .icon img { width: 130px; height: 40px; } .news_box .picnews { display: block; position: relative; border-radius: 10px; overflow: hidden; margin-bottom: 20px; } .news_box .picnews img { width: 360px; height: 220px; vertical-align: bottom; transition: .3s ease; } .news_box .picnews img:hover { transform: scale(1.2); transition: .3s ease; } .news_box .picnews p { display:none; position: absolute; bottom: 0; width: 360px; height: 40px; line-height: 40px; background-color: #000; background-color: rgba(0, 0, 0, .5); color: #fff; text-align: center; font-size: 16px; } .news_box .list_box a { display: block; line-height: 35px; } /* 图片 */ .pic_box { margin-bottom: 0px; } .left_pic { box-sizing: border-box; width: 399px; overflow: hidden; margin-right: 1px; } .right_pic { width: 800px; overflow: hidden; } .lpic_top { float: left; width: 399px; overflow: hidden; position: relative; height: 243px; } .lpic_top img { width: 399px; height: 243px; } .left_pic .lpic_top { height: 486px; } .right_pic .lpic_top { margin: 0 1px 1px 0; } .right_pic .lpic_top:nth-child(2n) { margin: 0 0 1px 0; } .right_pic .lpic_top:nth-child(n 3) { margin-bottom: 0px; } .left_pic .lpic_top img { width: 400px; height: 486px; } .pic_item .layer { opacity: 0; /*background: rgba(8, 155, 150, .8);*/ background: rgba(0, 0, 0, .3); filter: alpha(opacity=0); position: absolute; left: 0; bottom: -243px; width: 400px; height: 243px; transition: opacity 1s ease; } .pic_item p { opacity: 0; transition: opacity 1s ease; width: 100%; height: 243px; padding: 20px; box-sizing: border-box; position: absolute; left: 0; bottom: -243px; text-align: left; display: table; } .pic_item p span { display: table-cell; vertical-align: middle; color: #fff; line-height: 24px; } .pic_item h4 { bottom: 20px; position: absolute; z-index: 999; right: 20px; color: #fff; font-size: 34px; font-weight: 400; } .left_pic .pic_item p span { text-align: left; } .pic_item:hover .layer { opacity: 0.6; bottom: 0; filter: alpha(opacity=60); animation-name: move; animation-duration: 1s; } .pic_item:hover p { opacity: 1; bottom: 0; animation-name: move; animation-duration: 1s; } @keyframes move { from { bottom: -243px; } to { bottom: 0; } } .lpic_bot { width: 350px; height: 288px; overflow: hidden; position: relative; margin-top: 10px; } .lpic_bot img { width: 350px; height: 288px; } .lpic_bot .layer { width: 350px; height: 288px; } /* totop */ .totop { position: fixed; left: 50%; transform: translatex(620px); cursor: pointer; z-index: 999; display:none; } /* footer */ .footer { position: relative; height: 410px; /*background-color: #fff;*/ } .footer .linkbox { position: absolute; bottom: -96px; left: 50%; transform: translate(-50%, -100%); width: 1200px; height: 232px; padding: 30px 50px; background: rgba(255, 255, 255, .9); box-sizing: border-box; z-index: 3; } .footer .linkbox a { display: inline-block; float: left; width: 220px; font-size: 14px; color: #000; line-height: 24px; } .footer .linkbox a:hover { color: #008965; } .footer_tab { width: 100%; height: 42px; background-color: #008965; } .footer_tab li { float: left; /*0720-修改*/ padding: 0 0 0 0px; /*原位置 padding: 0 25px 0 35px;*/ line-height: 42px; color: #fff; cursor: pointer; /*background-color: #00523d;*/ } .footer_tab li .icon { margin: 0 0 0 10px; vertical-align: middle; } /*2023-07-20修改-网络地图样式 .footer_tab li:hover { background-color: #007658; } .footer_tab li:nth-child(1){ background-color: #007658; } --修改结束*/ .footer .main { padding: 37px 0; } .footer .main .left { box-sizing: border-box; width: 520px; height: 170px; border-right: 1px solid #ccc; } .footer .main .left div { float: left; margin-right: 15px; } .footer .main .left .xwzx, .footer .main .left .cxfz, .footer .main .left .rczp { margin-right: 25px; } .footer .main .left a { display: block; font-size: 13px; line-height: 25px; } .footer .main .left span {font-weight:bold;} .footer .main .middle { box-sizing: border-box; float: left; width: 310px; height: 170px; border-right: 1px solid #ccc; padding: 40px 15px 0; } .footer .main .middle a, .footer .main .right a { display: block; float: left; } .footer .main .middle a:nth-child(2) { float: right; } .footer .main .middle a img { margin-bottom: 20px; width: 130px; height: 50px; } .footer .main .middle a p, .footer .main .right a p { text-align: center; font-size: 14px; } .footer .main .right { box-sizing: border-box; width: 370px; height: 170px; /*2023-08-07 代码修改*/ padding: 0px; /*修改结束*/ /*源代码 padding: 20px 0px;*/ } .footer .main .right a { margin-left: 20px; float: right; } .footer .main .right a:nth-child(3) { /*2023-08-07 代码修改*/ margin-right: -34px; /*修改结束*/ /*源代码 margin-right: 0px;*/ } .footer .main .right a img { margin-bottom: 10px; width: 103px; height: 103px; } .footer .bottom { text-align: center; } .footer .bottom p { font-size: 14px; line-height: 25px; } .footer .bottom a {color:#000;} .footer .bottom a:hover {color:#008965;} .right_float{ position:fixed; left: 50%; bottom: 149px; width:200px; background-color: rgba(255, 255, 255, .9); background-image:url(/uploads/image/rimg/right_float_bg.png); background-repeat:repeat-x; z-index:999; border-radius:10px; padding:10px 10px 8px 10px; box-sizing: border-box; box-shadow: 0 0px 20px 0 rgba(0,0,0,0.1); display:none; transform: translatex(400px); } .right_float .right_float_p { padding:10px; font-size:12px; line-height:21px; height:120px; color: #666; } .right_float .right_float_b { text-align:center; } .right_float .right_float_b img { height:30px; } .right_float_close{ width:15px; position:absolute; right:8px; bottom:8px; cursor:pointer; } .right_float_icon .ic{ display: inline-block; width: 50px; height: 40px; padding-top: 10px; line-height: 15px; font-size: 12px; --bg-opacity: 1; /*background-color: #a0aec0;*/ background-color: rgba(1,167,150,var(--bg-opacity)); border-radius: .25rem; --text-opacity: 1; color: #fff; color: rgba(255,255,255,var(--text-opacity)); margin: 5px 3px; text-align: center; } .right_float_icon .ic:hover{ /*background-color: #01a796;*/ background-color: rgba(1,167,150,0.8); } .right_float_mini { position:fixed; left:50%; bottom:400px; width:60px; height:60px; background-color: rgba(25, 157, 105, .9); border-radius:30px; border:#98d8b5 8px solid; box-sizing: border-box; text-align:center; z-index:999; transform: translatex(620px); display:none; } .right_float_mini img { width:85%;margin-top:4px; } .right_float_gotop { position:fixed; left:50%; bottom:330px; width:60px; height:60px; background-color: rgba(25, 157, 105, .9); border-radius:30px; border:#98d8b5 8px solid; box-sizing: border-box; text-align:center; z-index:999; transform: translatex(620px); display:none; } .right_float_gotop img {width:68%;margin-top:8px;}