.cont-width{ width: 35%; margin: 0 auto; } .ul_sub { position:relative; } .cont-width .dao-hang .ul_sub>li{ width: 19%; padding: 25px 0; text-align: center; } .about .z1{ width: 25%; } .about .z2{ width: 65%; margin:3% 4% 0%; line-height: 175%; } .about .z2 .p2{ margin: 2% 0; } .about .z1 .img1{ width: 100%; -webkit-box-shadow: #dfdfdf 0 0 20px; -moz-box-shadow: #dfdfdf 0 0 20px; box-shadow: #dfdfdf 0 0 20px; } .about .z1 .img2{ max-width: 277px; width: 40%; margin-top: 7%; } .zi-zuo{ color: #0067B3; position: absolute; left: 0; bottom: 24%; } .zi-zuo .p-1{ font-size: 36px; margin-bottom: 35px; } .zi-zuo .p-2{ margin-bottom: 5px; } .zi-zuo .p-1:after { content: ""; display: block; position: absolute; left: 0; top:60px; width: 100px; height: 3px; background: #0067b4; margin-top: 0; margin-bottom: 7px; } .about2{ padding: 1% 0 2.7%; } .about2 .zuo-dao{ width: 15%; } .about2 .zuo-dao>li{ padding: 15px 0 15px 15%; background-color:#f2f2f2; } .about2 .zuo-dao li a{ color: #696969; display: block; } .about2 .zuo-dao li a:hover{ color: #0067b3; } .about2 .zuo-dao li:hover{ /*background: url("../images/tiao2.jpg") no-repeat left bottom;*/ background-color:white; } .about2 .zuo-dao li.one{ /*background: url("../images/tiao2.jpg") no-repeat left bottom;*/ background-color:white; } .about2 .zuo-dao li.one a{ color: #0067B3; } .about2 .wai{ width: 100%; } .about2 .wai .white-width{ /*height:252px;*/ width: 77%; margin: 2%; line-height: 267%; /*padding-bottom: 8%;*/ /*background: url("../images/1(1).jpg") no-repeat right bottom;*/ /*background-size: contain;*/ } .mar-bottom{ margin-bottom: 7px; } .mar-bottom15{ margin-bottom: 14px; } .mar-bottom25{ margin-bottom: 25px; } .ding2{ position: relative; } .ding2 .img3{ position: absolute; right: 60px ; top:-40px; -webkit-box-shadow: #dfdfdf 0 0 20px; -moz-box-shadow: #dfdfdf 0 0 20px; box-shadow: #dfdfdf 0 0 20px; width:20.9% ; max-width: 250px; } .ding2 .you-zi{ position:absolute; right: 0; top:35px; color: #0067B3; text-align: right; } .ding2 .you-zi .p-1{ font-size: 36px; margin-bottom: 35px; } .ding2 .you-zi .p-2{ margin-bottom: 5px; } .ding2 .you-zi .p-1:after { content: ""; display: block; position: absolute; right: 0; top:60px; width: 100px; height: 3px; background: #0067b4; margin-top: 0; margin-bottom: 7px; } .about3{ position: relative; padding: 4.5% 0 3%; } .rig-width{ background: url("../images/bg-2.png") right center; width:95.1% ; box-sizing: border-box; padding: 15px ; } .zi-zuo2{ color: #0067B3; position: absolute; left: 0; top:40%; } .zi-zuo2 .p-1{ font-size: 36px; margin-bottom: 35px; } .zi-zuo2 .p-2{ margin-bottom: 5px; } .zi-zuo2 .p-1:after { content: ""; display: block; position: absolute; left: 0; top:60px; width: 100px; height: 3px; background: #0067b4; margin-top: 0; margin-bottom: 7px; } .img4{ width: 22%; max-width: 250px; } .p-bg{ background: url("../images/white-bg.png"); line-height: 175%; width: 101%; padding:2% 2% 6.5% 6%; box-sizing: border-box; padding-left: 25%; } .p-bg .p4{ margin-bottom: 4%; } .about4{ padding-bottom: 4%; } .about4 dl{ width:17.7% ; float: left; margin-right:2.3%; background: #f2f2f2; margin-bottom: 20px; } .about4 dl dt img{ width: 100%; max-width: 212px; display: block; margin: 0 auto; } .about4 dl dd{ padding: 9px 7px ; box-sizing: border-box; height: 70px; } .about4 dl dd p{ margin-bottom: 5px; } .about5{ padding: 4% 0; } .about5 ul.ul-left{ background: url("../images/kuai-bg.png") no-repeat; width: 70%; padding-left: 5%; padding-top: 2%; box-sizing: border-box; } .about5 ul.ul-left li{ float: left; width: 40%; margin-bottom: 3%; line-height: 175%; } .about5 ul.ul-left li.li2{ width: 55%; } .ding3{ position: relative; } .img5{ width:25%; max-width: 300px; position: absolute; right: 50px; } .you-zi2{ position:absolute; right: 0; top:90px; color: #0067B3; text-align: right; } .you-zi2 .p-1{ font-size: 36px; margin-bottom: 35px; } .you-zi2 .p-2{ margin-bottom: 5px; } .you-zi2 .p-1:after { content: ""; display: block; position: absolute; right: 0; top:60px; width: 100px; height: 3px; background: #0067b4; margin-top: 0; margin-bottom: 7px; } .conp{ float:right; width:50% } .conp1{ float: left; width: 50%; line-height: 3em; } .conp1>p{ color:#0069b9; font-size:18px; padding:3% 12% 0; } .conp1>li{ color:#282828; font-size:13px; padding:2% 12% 0; } @media (max-width:1500px){ .cont-width{ width: 50%; } .about2{ /*padding-top: 33px;*/ } .about2 .wai .white-width { background-size: 62%; } } @media (max-width:990px){ .about .z1{ width: 80%; margin: 0 auto; float: none; } .about .z2{ width: 94%; text-align: justify; padding: 30px 3% 0px; } .zi-zuo{ top:90px; } .about .z2 .p2{ margin: 20px 0; } .ding2 .you-zi .p-1{ font-size: 26px; } .ding2 .you-zi .p-1:after{ top:50px; } .ding2 .you-zi .p-2{ font-size: 18px; } .ding2 .you-zi .p-3{ font-size: 14px; } .about2 .zuo-dao{ width: 13%; } .about2 .wai{ width: 75%; } .about2 .wai .white-width { width: 67%; } .zi-zuo2{ top:42%; } .zi-zuo2 .p-1{ font-size: 26px; } .zi-zuo2 .p-1:after{ top:50px; } .zi-zuo2 .p-2{ font-size: 18px; } .zi-zuo2 .p-3{ font-size: 14px; } .about4 dl dd{ height: 80px; } .you-zi2{ top:40px; } } @media (max-width:940px){ .cont-width{ width: 90%; } } @media (max-width:780px){ .about2 .zuo-dao{ width: 15%; } .about2 .wai{ width: 73%; } .about2 .wai .white-width { width: 65%; } .ding2 .you-zi { top: 150px; } .about5 ul.ul-left li{ width: 70%; margin-bottom: 10px; } .about5 ul.ul-left li.li2{ width: 70%; } .you-zi2{ top:200px; } } @media (max-width:700px){ .about .z1{ width: 100%; height: 150px; overflow: hidden; margin-bottom: 5%; display: none; } .about4 dl{ width:31.5% ; margin-right: 1.7% } } @media (max-width:640px){ #contents>div{ overflow-y: auto; } .cont-width{ width: 96%; } .cont-width .dao-hang .ul_sub li { width: 100%; text-align: left; box-sizing: border-box; padding: 10px 5px; } .zi-zuo .p-1{ font-size: 26px; } .zi-zuo .p-2{ font-size: 18px; } .zi-zuo .p-3{ font-size: 14px; } .zi-zuo .p-1:after { top: 50px; } .about2{ padding: 30px 0; } .ding2 .img3 { position: static; margin: 0 auto; display: block; width: 100%; margin-bottom: 30px; } .ding2 .you-zi{ left: 0; top:17%; text-align: left; } .ding2 .you-zi .p-1:after{ text-align: left; left: 0; } .about2 .zuo-dao{ width: 100%; } .zuo-dao>li{ width: 40%; float: left; padding:15px 5% !important; } .about2 .wai{ width: 26rem !important; padding: .1rem .4rem; height: 30rem !important; } .about2 .wai .white-width { width: 92%; } .img4{ width: 100%; max-width: 250px; display: block; margin: 0 auto; float: none; } .p-bg{ width: 100%; display: block; float: none; padding: 20px; } .zi-zuo2{ top:15%; } .img5{ width:60%; max-width: 300px; position: static; margin: 0 auto; right: 0; display: block; } .you-zi2{ left: 0; top:90px; text-align: left; } .you-zi2 .p-1:after{ left: 0; } .you-zi2 .p-1{ font-size: 26px; } .you-zi2 .p-1:after{ top:50px; } .you-zi2 .p-2{ font-size: 18px; } .you-zi2 .p-3{ font-size: 14px; } .about5 ul.ul-left{ width: 100%; padding-left: 0; } .about5 ul.ul-left li{ width: 45%; margin-bottom: 20px; } .about5 ul.ul-left li.li2{ width: 55%; } .conp , .conp1{ width: 100%; } .conp1{ padding-top: 2%; } .conp1>p{ padding: 1% 1% 0px; line-height: 1em; } .conp1>li{ padding: 2% 1%; } .conp1>li>p{ line-height: 18px; } #contents ul li{ height:14rem; } #contents1 .wai{ height:43rem !important; } } @media (max-width:500px){ .zi-zuo{ top:40px; } .about5 ul.ul-left li{ width: 100%; } .about5 ul.ul-left li.li2{ width: 100%; } } @media (max-width:390px){ .about .z1 .img1{ display: block; float: none; width: 100%; margin-bottom: 40px; } .about .z1 .img2{ display: block; float: none; width: 100%; margin: 10px auto; } .zi-zuo{ top:24%; } .about4 dl{ width:48% ; margin-right: 2% } .you-zi2{ top:30px; } } @media (max-width:400px){ .about2 .wai { width: 24rem !important; padding: .1rem .4rem; height: 30rem !important; } }