/* t20 */ .t20_table { margin-bottom: 90px; } .topp { line-height: 50px; font-size: 16px; color: #000; font-weight: 600; padding: 0 0 0 30px; } .topp .fr { position: absolute; top: -10px; right: 32px; } .topp .fr ul li { float: left; margin-left: 30px; } .topp .fr ul li span { line-height: 17px; display: inline-block; position: relative; top: 2px; } .topp .fr ul li img { width: 27px; height: 17px; border-radius: 3px; margin-right: 8px; object-fit: cover; } .t20_table .mlr30 { margin: 0 34px; } .t20_table ul li { float: none; height: 81px; font-weight: 600; position: relative; top: 22px; } .t20_table ul li div:nth-child(1) { position: absolute; top: -12px; left: 0; } .t20_table ul li div:nth-child(2) { position: absolute; top: 0; right: 0; width: 95.5%; height: 1px; background: #dedfdf; } .t20_table .dian { position: absolute; bottom: 0; right: 0; width: 95.5%; height: 100%; opacity: 0; } .t20_table .dian.active { opacity: 1; } .t20_table .dian .fl { width: 16.6%; text-align: center; height: 100%; } .t20_table .dian .fl .dian_dian { float: left; position: absolute; bottom: 59px; } .t20_table .dian .fl .dian_dian span { position: absolute; top: -22px; text-align: center; font-size: 14px; left: -2px; width: 100%; font-family: 'avant'; font-weight: bold; letter-spacing: -1px; } .t20_table .dian .fl .dian1 { left: 45%; } .t20_table .dian .fl .dian2 { left: 59%; } .t20_table .dian .fl .dian3 { right: 16%; } .t20_table .dian .fl:nth-child(2) .dian1 { left: 40%; } .t20_table .dian .fl:nth-child(2) .dian2 { left: 55%; } .t20_table .dian .fl:nth-child(2) .dian3 { right: 20%; } .t20_table .dian .fl:nth-child(3) .dian1 { left: 35%; } .t20_table .dian .fl:nth-child(3) .dian2 { left: 50%; } .t20_table .dian .fl:nth-child(3) .dian3 { right: 24%; } .t20_table .dian .fl:nth-child(4) .dian1 { left: 28%; } .t20_table .dian .fl:nth-child(4) .dian2 { left: 43%; } .t20_table .dian .fl:nth-child(4) .dian3 { right: 31%; } .t20_table .dian .fl:nth-child(5) .dian1 { left: 23%; } .t20_table .dian .fl:nth-child(5) .dian2 { left: 37%; } .t20_table .dian .fl:nth-child(5) .dian3 { right: 37%; } .t20_table .dian .fl:nth-child(6) .dian1 { left: 15%; } .t20_table .dian .fl:nth-child(6) .dian2 { left: 30%; } .t20_table .dian .fl:nth-child(6) .dian3 { right: 45%; } .t20_table .dian .fl .h1_7 img { height: 279px; overflow: hidden; } .t20_table .dian .fl .h1_3 img { height: 205px; overflow: hidden; } .t20_table .dian .fl .h1_2 img { height: 190px; overflow: hidden; } .t20_table .dian .fl .h1_0 img { height: 161px; overflow: hidden; } .t20_table .dian img { width: 23px; } .t20_table .dian.active .fl .h1_0 img { animation: hei_1 1s; overflow: hidden; } @keyframes hei_1 { 0% { height: 0; } 100% { height: 161px; overflow: hidden; } } .t20_table .dian.active .fl .h1_3 img { animation: hei_3 1s; overflow: hidden; } @keyframes hei_3 { 0% { height: 0; } 100% { height: 205px; overflow: hidden; } } .t20_table .dian.active .fl .h1_7 img { animation: h1_7 1s; overflow: hidden; } @keyframes h1_7 { 0% { height: 0; } 100% { height: 279px; overflow: hidden; } } .t20_table .dian.active .fl .h1_2 img { animation: h1_2 1s; overflow: hidden; } @keyframes h1_2 { 0% { height: 0; } 100% { height: 190px; overflow: hidden; } } .t20_table .dian.active .fl .h1_5 img { animation: h1_5 1s; overflow: hidden; } @keyframes h1_5 { 0% { height: 0; } 100% { height: 242px; overflow: hidden; } } .t20_table .dian.active .fl .h1_6 img { animation: h1_6 1s; overflow: hidden; } @keyframes h1_6 { 0% { height: 0; } 100% { height: 262px; overflow: hidden; } } .t20_table .dian .fl .h1_5 img { height: 242px; overflow: hidden; } .t20_table .dian .fl .h1_6 img { height: 262px; overflow: hidden; } .wenmzi { position: absolute; bottom: -10px; right: 0; width: 95.5%; } /* T10 */ .ts_mian { width: 100%; margin: 0 auto; } .ts_mian img { min-width: 800px } .ts_mian ul li { width: 50%; float: left } .ts_mian h1 { padding: 60px 0 35px; font-size: 30px; font-family: 'avant' } .ts_mian h2 { padding: 60px 0 0; font-size: 30px; font-family: 'avant' } .ts_mian p:first-child { font-size: 18px; font-weight: 600; font-family: 'avant' } .ta { text-align: center; } .ts_mian p:nth-child(2) { margin-top: 20px; width: 80%; position: relative; left: 13%; border-left: 1px solid #797979; height: 100px } .ts_mian ul li:nth-child(2) p:nth-child(2) { margin-top: 20px; width: 80%; position: relative; left: 18%; border-left: 1px solid #797979; height: 100px } .ts_mian p:nth-child(2) span { position: relative; height: 100%; width: 20%; float: right; font-family: 'avant'; border-right: 1px solid #d6d6d6 } .ts_mian li:nth-child(2) p:nth-child(2) span { position: relative; height: 100%; width: 10%; float: right; border-right: 1px solid #d6d6d6 } .ts_mian li:nth-child(2) p:nth-child(2).col_m9 span { width: 11.1%; } .ts_mian p:nth-child(2) i, .ts_mian p:nth-child(2) span i { position: absolute; right: -40px; font-style: normal; bottom: 0; font-weight: 600; } .about-section02 .about-section02-div img { margin-top: 10px; } .ts_mian p:nth-child(2)>i:first-child { left: -5px } .about-section02 .about-section02-div { text-align: justify; } .ts_mian p:nth-child(2) .jishu { font-family: 'avant'; top: 10%; left: -75px; font-style: normal; font-weight: 600; } .ts_mian p:nth-child(2) .jishu2 { top: 50%; font-family: 'avant'; left: -50px; font-style: normal; font-weight: 600; } .ts_mian p:nth-child(2) .jishutt { width: 0; top: 10%; left: 0; -webkit-transition: all 1s linear; transition: all 1s linear; height: 25%; background: #fd1a16 } .ts_mian p:nth-child(2) .jishutt i { opacity: 0; } .ts_mian p:nth-child(2) .jishutt i.active { opacity: 1; -webkit-transition: all 1s linear; transition: all 1s linear; } .ts_mian p:nth-child(2) .jishutt2 { width: 0; -webkit-transition: all 1s linear; transition: all 1s linear; top: 50%; left: 0; height: 25%; background: #dcdddd; } .ts_mian p:nth-child(2) .jishutt2 h6, .ts_mian p:nth-child(2) .jishutt h6 { position: absolute; padding: 5px 10px; color: #fff; right: 0; font-size: 14px } .ts_main_i10 ul li { width: 33.3%; } .ts_main_i10 p:nth-child(2) { left: 19%; border-bottom: 1px solid #797979; width: 76%; } .ts_mian p:nth-child(2) .ii, .ts_mian p:nth-child(2) span .ii { right: -5px; bottom: -29px; color: #333; } .ts_main_i10.ts_mian p:nth-child(2) span { width: 20% !important; } .ts_main_i10.ts_mian p:nth-child(2) .jishu { left: -70px; } .tabe_img211 .pr { overflow: hidden; margin: 0px 30px 0; } .tabe_img211 .hover { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; opacity: 0; } .tabe_img211 { top: 15px; } .tabe_img211 .topp .fr { top: 10px; } .tabe_img211.active .hover { animation: hh 1s; opacity: 1; } @keyframes hh { 0% { height: 0; } 100% { height: 100%; } } .ta_main_9 li:nth-child(2) p:nth-child(2) span { width: 11.1%; } .tabe_img211 .img2 { margin: 0 53px 0 60px; } @media (max-width:1440px) { .tabe_img211 .pr { margin: 0; }.tabe_img211 .img2 { margin: 0 25px 0 25px !important; } } @media (max-width:1024px) { .ts_mian ul li { width: 100%; float: none; } .ts_mian p:nth-child(2) { width: 80%; left: 20%; } .ts_mian p:first-child { font-size: 16px; } .ts_mian p:nth-child(2) i, .ts_mian p:nth-child(2) span i { font-size: 12px; } .ts_mian p:nth-child(2) .jishu { left: -71px; } .ts_mian p:nth-child(2) i, .ts_mian p:nth-child(2) span i { right: -35px; bottom: 5px; } } @media (max-width:1024px) { .tabe_img211 { top: 0; margin-bottom: 15px; } } @media (max-width:990px) { .t20_table, .tabe_img211 { display: none; } .phone_img.phone_img1 { display: block; } } @media (max-width:767px) { .t20_table .dian img { width: 10px; } .ts_mian p:nth-child(2) { left: 18%; } }