.about{ background: #f5f5f5; margin: 100px auto 16px auto; } .about .ly{ padding: 0; } .about .ly_text{ text-align: left; padding: 30px; } .about .ly_text h2{ font-size: 28px; margin-bottom: 30px; } .about .ly_text .des_text{ line-height: 1.8; margin-bottom: 60px; } .about .ly_text .des_label{ margin-bottom: 10px; } .about .ly_text .des_label label{ text-align: right; width: 6em; margin-right: 0.5em; } .about .ly_text .des_label label::after{ content: '|'; margin-left: 0.3em; font-weight: lighter; } .des_text_lots{ line-height: 1.8; text-align: left; } .three_goal{ margin-top: 60px; margin-bottom: 100px; } .three_goal li{ position: relative; padding: 0; width: 31.3%; margin-right: 3%; overflow: hidden; } .three_goal li:nth-child(3){ margin-right:0; } .three_goal li .bg_img{ width: 100%; transition: all 0.6s; } .three_goal li:hover .bg_img{ transform: scale(1.1); } .three_goal .cover{ width: 100%; height: 100%; background: url(../images/cover.png); position: absolute; left: 0; top:0; transition: all 0.6s; } .three_goal .cover .icon{ margin-top: 60px; margin-bottom: 16px; transition: all 0.6s; height: 60px; } .three_goal .cover h3{ color: #fff; font-size: 22px; } .three_goal .cover:hover{ background: url(../images/cover1.png); } .three_goal .cover:hover .icon{ opacity: 0; height: 0; } .three_goal .cover .hide_text{ margin-top: 10px; width: 0; overflow: hidden; transition: all 0.6s; } .three_goal .cover .hide_text p{ color: #fff; white-space:nowrap; } .three_goal .cover:hover .hide_text{ width: 100%; } @media (max-width: 500px) { .about { background: #f5f5f5; margin: 0px auto 0px auto; } .about .ly_text { text-align: left; padding: 5%; } .about .ly_text h2 { font-size: 1.8em; } .about .ly_text .des_text { margin-bottom: 30px; } .des_text_lots { line-height: 1.8; text-align: left; padding: 5%; } .about .ly_text .des_label label { text-align: left; width: 6em; margin-right: 0.5em; display: block; } .about .ly_text .des_label label::after { content: ''; } .three_goal { margin-top: 0px; margin-bottom: 30px; } .three_goal li { position: relative; padding: 0; width: 100%; margin-right: 0%; overflow: hidden; margin-bottom: 4px; } }