.min { width: 1100px; margin: 0 auto; } .banner_top { width: 100%; min-width: 1200px; height: 5.6rem; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; } .banner_top p { text-align: center; font-size: 34px; color: white; letter-spacing: 2px; } .banner_top div.text { width: 474px; /* width: 100%; */ padding-top: .4rem; text-align: center; font-size: 14px; color: #fff; line-height: .25rem; } .ulTabBg { background: #F8F9FC; } .ulTab .min { width: 1100px; margin: 0 auto; display: flex; justify-content: center; border-bottom: 1px solid #dfdfdf; padding: 0.8rem 0 0 0; } .liTab { font-size: 16px; height: 0.4rem; color: #333947; position: relative; text-align: center; margin-right: 1rem; cursor: pointer; transition: 0.5s; } .liTab:last-of-type { margin-right: 0; } .liTab.on::after, .liTab:hover::after { content: ""; width: 0.4rem; height: 3px; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); background-color: #202c70; transition: 0.5s; } .liTab.on, .liTab:hover { color: #202c70; transition: 0.5s; } .case { width: 1100px; margin: 0 auto; padding-top: .5rem; } .case_li { border-bottom: 1px solid #dfdfdf; } .case_li a { height: 2.2rem; box-sizing: border-box; display: flex; padding: .25rem 0; } .case_left_img { width: 255px; min-width: 255px; margin-right: 0.3rem; overflow: hidden; } .social_case_left_img { min-width: 230px; width: 230px; overflow: hidden; margin-right: 0.3rem; } .case_left_img img, .social_case_left_img img { transition: 0.5s; width: 100%; height: 100%; object-fit: contain; } .case_li:hover img { transform: scale(1.2); } .case_lid1 { position: relative; } .case_lip1 { font-size: 22px; color: #333947; line-height: .3rem; margin: .06rem 0 .12rem; font-weight: 400; } .case_li:hover .case_lip1 { color: #1b2a75; } .case_lip2 { font-size: 14px; color: #5e5f60; line-height: .22rem; } .case_lip3 { position: absolute; font-size: 12px; color: #5e5f60; bottom: .15rem; } .case_lip4 { padding-top: .13rem; font-size: 12px; color: #5e5f60; } .tuijian { font-size: 18px; color: #464d61; } .pub_contiain { min-width: 1200px; } @media screen and (max-width: 800px) { .pub_contiain { min-width: 100%; } .ulTab { width: 100% !important; padding: 0.3rem 0 0 0; } .liTab { height: .5rem; margin-right: .5rem; } .ulTab .min { width: 100%; padding-top: .3rem; } .case { width: 100% !important; padding: .1rem .3rem 0; } .case_li a { height: auto; } .case_left_img, .social_case_left_img { width: 1.5rem; min-width: 1.5rem; } .case_left_img img, .social_case_left_img img { width: 100%; } .social_case_left_img { margin-right: .2rem; } .banner_top { min-width: 0; } .banner_top div.text { width: 100%; padding: .4rem .3rem 0; line-height: .3rem; } .case_lip1 { font-size: 16px; line-height: .25rem; margin: 0 0 .05rem; } .edit_p1 { font-size: 20px !important; text-align: justify; } .newBox .case_lip1 { -webkit-line-clamp: 1; } .case_lip2 { line-height: .25rem; } .case_lip3 { position: relative; bottom: auto; margin-top: .1rem; } }