UTF-8ntSize22{ font-size:18px; } .limit-img{ overflow:hidden; } .fontSize20{ font-size:18px; } .grayLine { height: 3px; } .fontSize16{ font-size:14px; } .fontSize22 .summary{ margin-top:20px; } .content-top.content-top-4, .content-bottom, .item-card{ display:flex; justify-content: space-between; flex-wrap: wrap; } .content-top.content-top-4 .item{ width:49%; } .figure img{ width:100%; } .content-top.content-top-4 .item:nth-child(3), .content-top.content-top-4 .item:nth-child(4){ margin-top:30px; } .content-top .wrap{ position:relative; } .content-top .wrap .figure img{ position: absolute; } .content-top .wrap .figure a:after { content: ""; display: block; padding-top: 56.25%; } .content-top.content-top-1 .wrap .figure{ width:67%; } .content-top.content-top-4 .wrap .figure{ width:60%; } .content-top.content-top-1 .wrap .text{ width:34.6%; } .content-top.content-top-4 .wrap .text{ width:43%; } .content-top .wrap .text{ position: absolute; background:url(https://wwp-static.wenweipo.com/img/immed/immed-zz.png) no-repeat center; right: 0; top: 12%; height: 76%; padding: 10px 30px; display: flex; align-items: center; line-height: 1.5em; background-size:100%; } .content-top.content-top-1 .wrap .text{ background:url(https://wwp-static.wenweipo.com/img/immed/immed-zz-max.png) no-repeat center; background-size:100%; } .content-top .wrap .text:before { display: block; position: absolute; left: 0; width: 20px; border: 10px solid transparent; border-left-color: white; top: calc(50% - 10px); } .content-top.content-top-4 .wrap .text h2{ max-height:6em; overflow:hidden; } .content-top.content-top-1 .wrap .text h2{ max-height:3em; overflow:hidden; } .content-top .wrap .text a, .content-top .wrap .text a:link, .item-card .text a, .item-card .text a:link, .item-card .text a{ color:white; line-height:1.5em; } .item-card .text .summary, .fontSize22 .summary{ color:#B3C0C8; line-height:1.5em; } .point-parent{ display: flex; align-items: center; } .content-bottom{ margin-top:30px; } .content-bottom .item{ width:49%; } .item-list .item h2{ line-height:2em; } .item-list .redPoint{ width:14px; height:14px; min-width:14px; min-height:14px; background: #003251; border-radius:0; } .item-card .text{ padding:20px 15px; background:rgba(0,50,81,0.9); } .content-bottom-list-card .item-card .text h2{ min-height:3em; } .content-bottom-list-card .item-list{ display: flex; flex-wrap: wrap; align-items: center; } .content-bottom-list-card .item-list .item{ width:100%; } .column-content-word .summary{ margin-top:10px; } .item-card .figure:after{ content:""; display:block; border: 10px solid transparent; border-left-color: rgba(0,50,81,0.9); border-bottom-color: rgba(0,50,81,0.9); position: absolute; bottom: 0; } @media(max-width:650px){ .content-top.content-top-4 .item, .content-bottom .item, .content-top.content-top-4 .wrap .figure, .content-top.content-top-4 .wrap .text, .content-top.content-top-1 .wrap .figure, .content-top.content-top-1 .wrap .text{ width:100%; } .content-top.content-top-4 .item:nth-child(2), .content-top.content-top-4 .item:nth-child(3), .content-top.content-top-4 .item:nth-child(4), .content-bottom, .column-content-la .item-list, .item-card .item:nth-child(2){ margin-top:20px; } .column-content-word .item-list{ margin-bottom:20px; } .content-bottom-list-card .item-card .text h2{ min-height:unset; } .content-top .wrap .text{ position:unset; } .content-top .wrap .text{ padding:10px 15px; } .fontSize22 .summary{ margin-top:10px; } .item-card .figure:after{ display:none; } .content-top .wrap .text, .content-top.content-top-1 .wrap .text{ background:rgba(0,50,81,0.9); } .item-card .text{ padding:5px 15px; } body .column-content-hk .item a.twoLine{ -webkit-line-clamp: 2; } } .gaussian-blur a:hover { transform: scale(1.05, 1.05); transform-origin: center center; } .column-content-hk .item a.twoLine{ -webkit-line-clamp: 4; max-height: 10em; }