.cont{ background: #f1f1f1; /* background:url('/style/home/images/product/bg.png') no-repeat center; background-size:cover; */ } .product{ /* background:url('/style/home/images/product/bg.png') no-repeat center; background-size:cover; */ position:relative; } .product img{ width:100% } .product_title{ position:absolute; top:50%; transform:translateY(-50%); /* left:70px; */ left: 15%; color:#fff; z-index:1 } .product_img{ position:absolute; top:50%; transform:translateY(-50%); right:70px; width:30% } .product_title h3{ font-size:22px; } .product_title p{ font-size:14px; margin-top:10px } .intro_left_app{ display: none; } .left_pagination{ display: none; } .cont_cont{ /* E:\pro_list\cancon\public\style\home\images\product\bj.png */ background:url('/style/home/images/product/bj.png') no-repeat center; background-size:cover; } .cont_cont .cont_right{ height: 100%; margin: 0 auto; max-width: 1400px; padding: 100px 20px; } .cont_cont .cont_left{ width: 18%; float: left; position: absolute; left:-9999px; } .cont_cont .cont_left .left_list{ width: 100%; /* height: 120px; */ text-align: center; background: #414141; display: table; /* border-bottom: 1px solid gainsboro; */ color:#fff; cursor: pointer; padding: 14px 20px; margin-bottom:6px } .cont_cont .cont_left .left_list div{ display: table-cell; vertical-align: middle; } .cont_cont .cont_left .left_list div img{ /* width: 22%; */ /* margin-bottom: 6px; */ width: 20px; margin-bottom: 0; float: left; margin-right: 18px; } .cont_cont .cont_left .left_list div p{ float:left } .cont_cont .cont_left .active_list{ background: #b01f24; /* border-bottom: 4px solid #b01f24; */ } .cont_right .right_cont{ height: 100%; overflow: hidden; overflow-y: auto; display: none; } .cont_right .right_cont::-webkit-scrollbar {/*滚动条整体样式*/ width: 6px; /*高宽分别对应横竖滚动条的尺寸*/ height: 1px; } .cont_right .right_cont::-webkit-scrollbar-thumb {/*滚动条里面小方块*/ -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); background: #535353; } .cont_right .right_cont .right_list{ border-bottom: 1px solid gainsboro; /* height: 33.3%; */ } .cont_right .right_cont .right_list:nth-child(odd){ background: white; } .cont_right .right_cont .right_list:nth-child(even){ background: #fbfbfb; } .cont_right .right_cont .right_list .right_img{ float: left; width: 35%; margin: 20px 0; } .cont_right .right_cont .right_list .right_img img{ width: 82%; display: block; margin: 0 auto; } .cont_right .right_cont .right_list .right_title{ float: left; width: 65%; margin: 20px 0; } .cont_right .right_cont .right_list .right_title h4{ font-size: 17px; font-weight: bold; margin-top: 10px; } .cont_right .right_cont .right_list .right_title p{ width: 84%; font-size: 12px; margin: 10px 0; letter-spacing: 0.6px } .cont_right .right_cont .right_list .right_title ul{ } .cont_right .right_cont .right_list .right_title ul li{ float: left; margin-right: 10px; } .cont_right .right_cont .right_list .right_title ul li a{ color: black; display: inline-block; border-radius: 5px; padding: 4px 6px; font-weight: bold; font-size: 12px; } .cont_right .right_cont .right_list .right_title ul .active_li_a a{ background: #b01f24; color: white; } .cont_right .right_cont .right_list .right_title ul li a:hover{ background: #b01f24; color: white; } .foot { position: relative; } @media screen and (max-width: 1450px) { .cont_cont{ max-width:1200px; margin: 0 auto; } .product_title { left: 100px; } } @media screen and (max-width: 1180px){ .cont_cont .cont_left , .cont_cont .cont_right{ width:100% } .cont_cont .cont_left .left_list{ width: 25%; float: left; /* height: 78px; */ } } @media screen and (max-width: 770px){ .product_title { left: 10px !important; } .product_img{ right:26px !important; } .product_title h3 { font-size: 18px !important; } .product_title p { margin-top: 5px; font-size: 12px; } .cont_cont , .cont_cont .cont_left , .cont_cont .cont_right,.cont_data .product_intro .intro_right{ width: 100% !important; } .cont_data .product_intro .intro_right { height: 100% !important; } .cont_cont .cont_left .left_list{ width: 33.333333%; float: left; /* height: 78px; */ } .cont_cont .cont_left .left_list div img { /* width: 16%; */ } .cont_right .right_cont .right_list .right_title p { width: 96%; text-align: justify; } .cont_right .right_cont .right_list .right_title ul li { margin-right: 6px; } .cont_right .right_cont .right_list .right_img { margin-top: 40px; } .cont_right .right_cont .right_list .right_title { margin-top: 16px; } .cont_right .right_cont .right_list .right_title h4 { margin-top: 0; } .cont_data .cont_top { height: 100px; } .cont_data .cont_top h3 { margin-left: 0; line-height: 80px; font-size: 18px; } .cont_data .cont_top p { /* left: 3%; */ } .cont_data .product_intro { padding: 0 3%; } .cont_data .product_intro .intro_left { width: 100%; text-align: center; height: auto; line-height: initial; position: static; transform: translateY(0); } .cont_data .product_intro .intro_left img { width: 90% !important; } .cont_data .intro_swiper { position: initial !important; width: 86% !important; } .cont_data .intro_swiper .swiper-slide .img_list { padding: 8px 0 !important; } .cont_data .intro_swiper .swiper-slide .img_list img{ width: 80% !important; } .cont_data .intro_swiper .swiper-button-next { left: 93% !important; transform: rotate(0deg) !important; top: auto !important; margin-top: -50px !important; bottom: auto !important; } .cont_data .intro_swiper .swiper-button-prev { transform: rotate(0deg) !important; left: 3% !important; top: auto !important; margin-top: -50px !important; bottom: auto !important; } .cont_data .describe_left { position: absolute; top: 50%; margin-top: -20px; } .cont_data .describe { padding: 30px 0; } .cont_data .table_video { width: 96%; } .cont_data .cont_table { padding: 36px 0; } .cont_data .table_cont { width: 98%; margin: 30px auto 20px; } /*.cont_data .table_title p { width: auto; padding-right: 40px; text-indent: 12px; font-size: 12px; margin-bottom: 4px; }*/ /* .cont_data .table_title p:nth-child(2) { margin-left: -26px; text-indent: 36px; } .cont_data .table_title p:nth-child(3) { margin-left: -26px; text-indent: 36px; } .cont_data .table_title p:nth-child(4) { margin-left: -26px; text-indent: 36px; }*/ .cont_data .table_cont table tr td { padding: 8px 8px 8px 12px; } .cont_data .table_cont table tr td:nth-child(1) { width: 22%; } .cont_data .table_cont table tr td:nth-child(2) { width: 78%; } .cont_data .resource { width: 98%; } .cont_data .resource .resource_cont .resource_list { width: 49%; margin-right: 1%; margin-bottom: 1%; } .cont_data .resource .resource_cont .resource_list .resource_left { width: 24%; } .cont_data .resource .resource_cont .resource_list .resource_right { width: 74%; } .cont_data .resource .resource_cont .resource_list .resource_right p span:nth-child(1) { margin-right: 8px; } .cont_data .resource .resource_cont { margin-bottom: 0; } } @media screen and (max-width: 769px){ .intro_left_pc{ display: none; } .intro_left_app{ display: block; } .cont_data .describe .describe_container { width: 76%; padding: 0; } .cont_data .describe .swiper-button-next { right: 20px; } .cont_data .describe .swiper-button-prev { left: 20px; } } @media screen and (max-width: 650px){ .cont_cont .cont_left .left_list { width: 49%; padding: 14px 12px; font-size: 13px; height: 48px; } .cont_cont .cont_left .left_list:nth-child(2n){ margin-left: 2% } .product { background: url(/style/home/images/product/img.jpg) no-repeat center; background-size: cover; height: 150px; } .product>img{ display:none } } @media screen and (max-width: 550px){ .cont_data .intro_swiper .swiper-button-next , .cont_data .intro_swiper .swiper-button-prev { margin-top: -38px; } .product_title h3{ font-size:15px } .cont_data .product_intro .intro_right { padding: 40px 20px 40px 50px; } .cont_data .product_intro .intro_right h4 img { top: 1px; width: 16px; } .approve li>img { width: 20px; height: 20px; } .cont_data .describe_left { text-align: center; } .cont_right .right_cont .right_list .right_title ul li { margin-right: 0; width: 50%; } .cont_data .product_intro .intro_right h2 { margin-right: -36px; line-height: 26px; } } .approve li:nth-last-child(2){ margin-right:0 } @media (min-width: 771px) and (max-width: 1030px) { .cont_cont { width: 100%; } .foot { position: fixed !important; } .cont_data .cont_top h3{ margin-left: 6.5%; } .cont_data .cont_top h3 , .cont_data .cont_top p{ left: 6.5%; } .cont_data .product_intro { padding: 0 3%; background: white; } .cont_data .intro_swiper { width: 45%; height: 30%; top: 243px; left: -431px; padding: 20px 26px; } .cont_data .intro_swiper .swiper-button-prev { top: auto; left: 1%; bottom: 48px; transform: rotate(0deg); } .cont_data .intro_swiper .swiper-button-next { bottom: 48px; left: 96%; transform: rotate(0deg); } .cont_data .product_intro .intro_left { width: 44%; top: 38%; text-align: center; } .cont_data .product_intro .intro_left img { width: 90% !important; } .cont_data .product_intro .intro_right { width: 50%; } .cont_data .resource { width: 94%; } .cont_data .resource .resource_cont .resource_list .resource_right p span:nth-child(1) { margin-right: 10px; } } @media (min-width: 900px) and (max-width: 1025px) { .cont_data .intro_swiper { /* lff---加了important */ width: 45%!important; top: 204px!important; left: -490px!important; padding: 20px 26px!important; } } @media screen and (min-width: 1560px){ .cont_cont .cont_left .left_list { /* height: 150px; */ } .cont_right .right_cont .right_list { height: 25%; } .cont_right .right_cont .right_list .right_img img { width: 72%; } .cont_data .intro_swiper { /* height: 88%; */ } } @media screen and (min-width: 1880px){ .approve li { font-size: 13px; } .cont_cont .cont_left .left_list { /* height: 170px; */ } .cont_right .right_cont .right_list .right_title { margin-top: 30px; } .cont_right .right_cont .right_list .right_img { margin-top: 28px; } .cont_data .product_intro .intro_right h4 { font-size: 17px; line-height: 22px; } .cont_data .product_intro .intro_right h4 img { position: absolute; top: 0; left: -36px; width: 5%; } .cont_data .product_intro .intro_right p { font-size: 13px; margin: 20px 0; line-height: 22px; } .cont_data .product_intro .intro_right { width: 45%; /* height: 346px; */ /* padding: 42px 24px 12px 56px; */ } .cont_data .intro_swiper { /* width: 7%; */ /* height: 73%; */ } .cont_data .product_intro .intro_left { /* height: 346px; */ /* line-height: 322px; */ } .cont_data .product_intro .intro_left img { /* width: 100%; */ } .cont_data .describe_right h5 { font-size: 17px; margin-bottom: 17px; } .cont_data .describe_right p { font-size: 14px; line-height: 20px; } .cont_data .table_video p { font-size: 14px; width: 70%; margin: 0 auto; } /* .cont_data .table_title p:nth-child(2) { margin-left: -48px; text-indent: 61px; }*/ .cont_data .table_cont table { font-size: 14px; } .cont_data .table_cont table tr td { /* padding: 14px 14px 14px 26px; */ } .cont_data .resource .resource_cont .resource_list { padding: 16px; } .cont_data .resource .resource_cont .resource_list .resource_right { font-size: 14px; } .cont_data .resource .resource_cont .resource_list .resource_right h5 { font-size: 14px; } .cont_data .resource h4 { font-size: 20px; } } /* 2023.4.28更改 */ @media screen and (max-width:768px){ .product_title { left: 10px !important; top: 45%; } .product_title p{ margin-top: 5px; } .cont_data .describe_left{ position: relative; top: 10px; } .cont_data .describe{ margin-top: 30px; } .cont_data .table_title p{ padding: 0; width: 100% !important; font-size: 15px; margin-bottom: 5px; } .cont_data .table_title .active_p{ background: url("../images/product_delet/new_title_bg1.png") no-repeat; background-size: 100% 100%; } .cont_data .table_title p:nth-child(1){ height: 40px !important; line-height: 40px !important; font-size: 15px !important; } /* 2023.5.8更改 */ .product_title p:first-of-type{ margin-bottom: 15px; } .product_title p:first-of-type span{ font-size: 15px !important; } .product{ background: none; } .product > img{ display: block; height: 100%; } } .cont_mt{ width: 100%; height: 600px; display: flex; flex-direction: column; justify-content: space-between; } .cont_list { display: flex; /* justify-content: space-between; */ flex-wrap: wrap; height: 100%; } .cont_mt_item{ width: 24.7%; background: #fff; margin: 1px; height: 49.7%; } .mt_item_box{ padding-top: 20px; padding-left: 30px; box-sizing: border-box; } .pic{ display: inline-block; width: 30px; margin: 10px 0; } .item_title{ font-family: HarmonyOS_Sans_SC_Bold; font-weight: 600; color: #111111; line-height: 30px; font-size: 18px; } .color_cc{ font-size: 15px; font-family: HarmonyOS_Sans_SC; font-weight: 400; color: #999999; line-height: 30px; width: 98%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .item_serve{ font-family: HarmonyOS_Sans_SC_Medium; font-weight: 400; color: #333333; line-height: 32px; } .item_serve a{ color: #333333; } @media screen and (max-width:768px){ .cont_mt{ height: auto; } .cont_list{ flex-direction: column; } .cont_mt_item{ width: 100%; margin-top: 10px; } }