@charset "utf-8"; body {} .gg-tit { color: #333333; font-size: 30px; padding-top: 45px; line-height: 30px; font-weight: 600; padding-bottom: 0; border-bottom: 1px solid #ccc; overflow: hidden;} .gg-tit a { float: right; font-weight: normal; color: #999999; font-size: 14px; } .gg-tit a:hover { color: #015290; } .gg-tit a.on { display: block; } .gg-tit span { position: relative; padding-bottom: 10px; margin-left: 80px; font-size: 28px; line-height: 30px; color: #000000; padding-right: 10px; font-weight: normal; height: 47px;float: left;} .gg-tit span:first-child { margin-left: 0; } .gg-tit span::after { content: ""; position: absolute; right: 0; left: 0; height: 2px; background: #215297; transition: all 0.3s; bottom: 0; } .gg-tit span.on { color: #333; position: relative; } .index { overflow: hidden; background: no-repeat; background-position: right bottom; } .title { text-align: center; padding: 40px 0; } .title h2 { font-size: 30px; font-weight: normal; line-height: 32px; color: #f5f5f5; } .section1 { background: url(/uploads/image/zimages/s1-bj.png) no-repeat; background-position: center top; background-size: cover; } .s1-c ul li a { display: block; margin: 0 30px; border-radius: 10px; line-height: 140px; font-size: 0; text-align: center; } .s1-c ul li:nth-child(3n 1) a { background: #968ece; } .s1-c ul li:nth-child(3n 2) a { background: #71d1e5; } .s1-c ul li:nth-child(3n) a { background: #d3b969; } .s1-c ul li a img { display: inline-block; vertical-align: middle; } .s1-c ul li a span { display: inline-block; vertical-align: middle; font-size: 24px; margin-left: 20px; color: #fff; } .section2 { margin-top: 70px; } .section2>div>div { float: left; width: 32%; margin-left: 2%; } .section2>div>div:first-child { margin-left: 0; } .s2-lul { padding-top: 15px; } .s2-lul li { padding-top: 10px; padding-bottom: 15px; border-bottom: 1px solid #ddd; } .s2-lul li a { display: block; position: relative; padding-left: 61px; font-size: 16px; overflow: hidden; line-height: 24px; letter-spacing: 0px; color: #333333; height: 48px; } .s2-lul li a span { position: absolute; left: 0; top: 0; width: 47px; background: #7fa3d7; color: #fff; text-align: center; border-radius: 5px; line-height: 23px; font-size: 14px; } .s2-lul li a:hover { color: #1e65ab; } .s2-lul li a:hover span { background: #ef9136; } .s2-rinfo { box-shadow: 0 0 10px rgba(0, 0, 0, .1); padding-bottom: 50px; } .title2 { position: relative; margin-top: 80px; margin-bottom: 40px; } .title2 a { position: absolute; right: 0; top: 50%; transform: translatey(-50%); color: #999999; font-size: 14px; } .title2 h2 { text-align: center; font-size: 0; } .title2 h2 img { vertical-align: middle; } .title2 h2 span { color: #000000; font-size: 28px; margin: 0 10px; vertical-align: middle; } .s3-l { float: left; width: 45.8%; margin-right: 1%; } .s3-l a { display: block; position: relative; } .s3-l a .pic { padding-top: 75%; } .s3-l a>img { position: absolute; left: 50%; top: 50%; transform: translatex(-50%) translatey(-50%); } .s3-r { overflow: hidden; } .s3-r ul { overflow: hidden; } .s3-r ul li { float: left; width: 49%; } .s3-r ul li:nth-child(3), .s3-r ul li:nth-child(4) { padding-top: 2%; } .s3-r ul li:nth-child(2n 1) { margin-right: 2%; } .s3-r ul li a { display: block; position: relative; } .s3-r ul li a:hover .pic img { transform: scale(1.1); } .s3-r ul li a .pic { padding-top: 64%; } .s3-cinfo { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(/uploads/image/zimages/banner-zzc2.png) repeat-x; background-position: center bottom; } .s3-cinfo p { position: absolute; left: 20px; right: 20px; bottom: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #fff; line-height: 50px; font-size: 16px; text-align: center; } .s4-c { margin-bottom: 90px; } .s4-c ul li:nth-child(7n 1) a { background: url(/uploads/image/zimages/s4-icon1.png) no-repeat; background-size: auto 100%; background-position: center center; } .s4-c ul li:nth-child(7n 2) a { background: url(/uploads/image/zimages/s4-icon2.png) no-repeat; background-size: auto 100%; background-position: center center; } .s4-c ul li:nth-child(7n 3) a { background: url(/uploads/image/zimages/s4-icon3.png) no-repeat; background-size: auto 100%; background-position: center center; } .s4-c ul li:nth-child(7n 4) a { background: url(/uploads/image/zimages/s4-icon4.png) no-repeat; background-size: auto 100%; background-position: center center; } .s4-c ul li:nth-child(7n 5) a { background: url(/uploads/image/zimages/s4-icon5.png) no-repeat; background-size: auto 100%; background-position: center center; } .s4-c ul li:nth-child(7n 6) a { background: url(/uploads/image/zimages/s4-icon6.png) no-repeat; background-size: auto 100%; background-position: center center; } .s4-c ul li:nth-child(7n) a { background: url(/uploads/image/zimages/s4-icon7.png) no-repeat; background-size: auto 100%; background-position: center center; } .s4-c ul li a { display: block; padding: 30px 0; background-position: center center; } .s4-c ul li a div { margin: 0 auto; width: 92px; height: 92px; border-radius: 50%; line-height: 92px; font-size: 0; text-align: center; } .s4-c ul li:nth-child(7n 1) a div { background: #4bd094 } .s4-c ul li:nth-child(7n 2) a div { background: #09becd } .s4-c ul li:nth-child(7n 3) a div { background: #e0cd68 } .s4-c ul li:nth-child(7n 4) a div { background: #c79167 } .s4-c ul li:nth-child(7n 5) a div { background: #8999ed } .s4-c ul li:nth-child(7n 6) a div { background: #e67c7c } .s4-c ul li:nth-child(7n) a div { background: #64b0dc } .s4-c ul li a div p { color: #fff; display: inline-block; font-size: 16px; line-height: 24px; text-align: center; vertical-align: middle; } @media screen and (max-width:1200px) { .s1-c ul li a{ margin: 0 10px; } .title h2,.gg-tit span,.title2 h2 span{ font-size: 26px; } } @media screen and (max-width:1024px) { .s1-c ul li a span{ font-size: 20px; } .title h2,.gg-tit span,.title2 h2 span{ font-size: 24px; } .gg-tit span{} .s3-l a>img{ max-width: 30px; } .title{ padding: 25px 0; } .gg-tit{ padding-top: 20px; } .section2{ margin-top: 15px; } .title2{ margin-top: 35px; margin-bottom: 25px; } .s4-c{ margin-bottom: 30px; } } @media screen and (max-width:768px) { .title h2, .gg-tit span,.title2 h2 span{ font-size: 20px; } .s3-cinfo p{ font-size: 14px; line-height: 35px; } .s1-c ul li a{ line-height: 110px; } .s1-c ul li a img{ max-height: 40px; } .s1-c ul li a span{ font-size: 18px; } .section2>div>div{ float: none; width: auto; margin-left: 0; } .s2-lul li a{ height: auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .s3-l{ float: none; width: auto; margin-right: 0; } .s3-r{ padding-top: 2%; } .title2 h2 { text-align: left; } .title2 h2 img{ display: none; } } @media screen and (max-width:480px) {}