.pl_layout { overflow: hidden; } .banner { background-color: #e6e6e6; padding: 40px 10px; } .banner div { max-width: 1040px; margin: 0 auto; text-align: center; } .banner h1 { font-size: 26px; color: #2d2d2d; margin-bottom: 20px; } .banner p { color: #6b6b6b; font-size: 12px; line-height: 20px; } .banner img { width: 100%; margin-top: 30px; } .banner img.logo { width: 50px; margin-bottom: 20px; margin-top: 0; } .content { max-width: 1490px; margin: 0 auto; padding-left: 15px; padding-right: 15px; } .info h2 { font-size: 18px; color: #2d2d2d; } .info p { color: #6b6b6b; font-size: 12px; line-height: 20px; } .lplan_1 { margin: 60px 0 20px; } .lplan_1 .info { text-align: center; } .lplan_1 .info h2 { margin-bottom: 10px; } .categ { margin-top: 40px; } .categ-layout { overflow: hidden; float: left; width: 100%; } .categ-layout div { width: 50%; text-align: center; float: left; box-sizing: border-box; padding-left: 20px; padding-right: 20px; margin-bottom: 40px; } .categ-layout div img { max-width: 100%; } .categ-layout div h3 { font-size: 14px; color: #2d2d2d; margin: 20px 0 10px; } .categ-layout div p { color: #6b6b6b; font-size: 12px; line-height: 18px; text-align: center; } .lplan_2 { padding-top: 50px; padding-bottom: 62.8%; background: #f3f2f0 url('http://video.cgaii.com/new4dage/images/images/lp_2_bg.jpg') no-repeat bottom left; background-size: 100% auto; } .lplan_2 .info { padding-left: 30px; padding-right: 30px; } .lplan_2 .info div { margin-top: 30px; } .lplan_2 .info p:nth-child(1) { padding-left: 20px; background: url('http://video.cgaii.com/new4dage/images/images/lp_2_icon.jpg') no-repeat left center; } .lplan_2 img { width: 100%; } .lplan_3 { padding: 50px 0; text-align: center; } .lplan_3 .info { margin-bottom: 40px; } .lplan_3 .info h2 { margin-bottom: 15px; } .lplan_4 { text-align: left; margin: 60px 0 50px; position: relative; } .lplan_4 img { width: 100%; display: block; } .lplan_4 h2 { margin-bottom: 10px; } .lplan_4 .info { padding: 10px; } .banner .info img { width: 50px; margin-bottom: 30px; } @media screen and (min-width: 1040px) { .lplan_4 { text-align: center; } .lplan_4 .info { position: absolute; left: 19%; top: 12%; width: 58.6%; padding: 0; } .banner { padding-top: 60px; padding-bottom: 60px; } .banner h1 { font-size: 48px; margin-bottom: 30px; } .banner p { font-size: 14px; line-height: 30px; } .info h2 { font-size: 30px; } .info p { font-size: 16px; line-height: 20px; } .lplan_1 { margin: 146px 0 130px; } .categ { margin-top: 74px; } .categ-layout { overflow: hidden; float: left; width: 50%; } /* .categ-layout div { width: 25%; } */ .categ-layout div h3 { font-size: 18px; margin: 75px 0 15px; margin-left: -2px; } .categ-layout div p { font-size: 14px; line-height: 25px; } .lplan_2 { padding-bottom: 103px; background-position: right bottom; background-size: 56vw auto; } .lplan_2 .info { padding-right: 56vw; padding-left: 140px; } }