footer .con-top { background: #f6f6f6; } .leader { padding: 3rem 0 8rem; background: url(../img/about/leader/bg.jpg) no-repeat left bottom; background-size: contain; } .leader .con .title h2 { font-size: 2.4rem; font-weight: bold; color: #000; } .leader .con .title p { font-size: 0.9rem; color: #555; margin-top: 0.6rem; } .leader .con .leader-top { margin-top: 3.5rem; padding-bottom: 3rem; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .leader .con .leader-top ul li { float: left; width: 47.6%; position: relative; box-shadow: 2px 9px 81px 0px rgba(173, 173, 173, 0.23); } .leader .con .leader-top ul li:nth-child(odd) { margin-right: 4.8%; } .leader .con .leader-top ul li .left { float: left; width: 46%; height: 0; padding-bottom: 66%; overflow: hidden; } .leader .con .leader-top ul li .left img { width: 100%; } .leader .con .leader-top ul li .right { position: absolute; width: 54%; height: 100%; top: 0; right: 0; background: #fff; padding: 2.5rem 2rem; } .leader .con .leader-top ul li .right h2 { font-size: 1.5rem; font-weight: bold; color: #000; } .leader .con .leader-top ul li .right h3 { font-size: 1rem; color: #555; margin-top: 1rem; } .leader .con .leader-top ul li .right .line { position: absolute; bottom: 2.5rem; left: 2rem; width: 2.5rem; height: 3px; background: #004da1; } .leader .con .leader-bottom ul li { float: left; width: 31.9%; position: relative; box-shadow: 2px 9px 81px 0px rgba(173, 173, 173, 0.23); margin-top: 3rem; } .leader .con .leader-bottom ul li:not(:nth-child(3n)) { margin-right: 2.15%; } .leader .con .leader-bottom ul li .left { float: left; width: 46%; height: 0; padding-bottom: 66%; overflow: hidden; } .leader .con .leader-bottom ul li .left img { width: 100%; } .leader .con .leader-bottom ul li .right { position: absolute; width: 54%; height: 100%; top: 0; right: 0; background: #fff; padding: 2rem 1.6rem; } .leader .con .leader-bottom ul li .right h2 { font-size: 1.5rem; font-weight: bold; color: #000; } .leader .con .leader-bottom ul li .right h3 { font-size: 0.9rem; color: #555; margin-top: 1rem; } .leader .con .leader-bottom ul li .right .line { position: absolute; bottom: 2rem; left: 1.6rem; width: 2rem; height: 3px; background: #004da1; } .leader .con .leader-bottom .more { text-align: center; } .leader .con .leader-bottom .more a { display: inline-block; margin: 4rem auto 0; padding: 0.7rem 1.5rem 0.8rem; border: 3px solid #d8222a; font-size: 0.9rem; color: #606060; } .leader .con .leader-bottom .more a span { margin-left: 1.5rem; font-size: 1.2rem; color: #999; position: relative; top: 2px; } .leader .con .leader-bottom .more a:hover { background: #d8222a; color: #fff; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } .leader .con .leader-bottom .more a:hover span { color: #fff; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; } @media screen and (max-width: 768px) { .leader { padding: 20px 0 40px; } .leader .con .title h2 { font-size: 18px; } .leader .con .title p { font-size: 14px; } .leader .con .leader-top { margin-top: 20px; padding-bottom: 20px; } .leader .con .leader-top ul li { width: 100%; } .leader .con .leader-top ul li:nth-child(odd) { margin-right: 0; } .leader .con .leader-top ul li:not(:first-child) { margin-top: 10px; } .leader .con .leader-top ul li .right { padding: 20px; } .leader .con .leader-top ul li .right h2 { font-size: 16px; } .leader .con .leader-top ul li .right h3 { font-size: 14px; margin-top: 10px; } .leader .con .leader-bottom { margin-top: 10px; } .leader .con .leader-bottom ul li { width: 100%; margin-top: 10px; } .leader .con .leader-bottom ul li:not(:nth-child(3n)) { margin-right: 0; } .leader .con .leader-bottom ul li .right { padding: 20px; } .leader .con .leader-bottom ul li .right h2 { font-size: 16px; } .leader .con .leader-bottom ul li .right h3 { font-size: 14px; margin-top: 10px; } .leader .con .leader-bottom .more a { margin: 40px 0; font-size: 14px; padding: 8px 15px; } .leader .con .leader-bottom .more a span { margin-left: 14px; font-size: 14px; top: 0; } } /*# sourceMappingURL=about_leader.css.map */