﻿.pattern01 {padding: 0;background: none;box-shadow: none;position: relative;z-index: 3 }.pattern01 .ttl h3 {padding: 0;background: none !important;color: #1d1d1d }.pattern01 .allItems {display: inline-block;width: 100%;}.pattern01 ul{display: flex;flex-wrap: wrap;gap:16px}.pattern01 ul li {width: calc((100% - 48px) / 4);height: auto;position: relative;overflow: hidden;background: #fff;border: 1px solid #e8e8e8;border-radius:8px }.pattern01 ul li .item{display:flex;flex-wrap: wrap;}.pattern01 ul li a {display: block }.pattern01 ul li .item .imageCntnr {display: flex;position: relative;overflow: hidden;aspect-ratio:16 / 9;width: 100%;}.pattern01 ul li .item img:not(article .details .divVideoStep .ivbsThumbWrapper>img) {position: absolute;top: 50%;right: auto;bottom: auto;left: 50%;transform: translate(-50%,-50%);margin: 0 auto !important;width: 100%;height: auto;transition: none }.pattern01 ul li .desc {width: 100%;overflow: hidden;cursor: pointer;position: relative;padding:10px }.pattern01 ul li .desc h2 {color: #000000;cursor: pointer;overflow: hidden;text-align: right;line-height: 26px;font-size: 16px;margin-bottom:10px;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;transition: all 0.2s ease-in-out 0s;-webkit-transition: all 0.2s ease-in-out 0s;-moz-transition: all 0.2s ease-in-out 0s;-o-transition: all 0.2s ease-in-out 0s;-ms-transition: all 0.2s ease-in-out 0s }.pattern01 ul li .item .desc:hover h2 {color: #666 }.pattern01 ul li .secName {font-family: AvenirMeduim, Arial;font-size: 14px;color: #fff;pointer-events: visible;margin-bottom:4px }.pattern01 ul li.icon-video .imageCntnr span, .pattern01 ul li.icon-image .imageCntnr span {position: absolute;width: 32px;height: 32px;left: 4px;top: 4px;z-index: 1;line-height: 32px;text-align: center;background: #E03322;border-radius: 50%;}.pattern01 ul li.icon-video .imageCntnr span:before, .pattern01 ul li.icon-image .imageCntnr span:before {color: #fff;font-size: 17px;line-height: 32px;opacity: 1;transition: all .2s ease-in-out 0s;-webkit-transition: all .2s ease-in-out 0s;-moz-transition: all .2s ease-in-out 0s;-ms-transition: all .2s ease-in-out 0s;-o-transition: all .2s ease-in-out 0s;}.pattern01 ul li.icon-image .imageCntnr span:before {content: "t";}.pattern01 ul li.icon-video .imageCntnr span:before {content: "s";margin-left: 2px }@media screen and (min-width:1280px) and (max-width:1919px) {.pattern01 ul li .desc h2 {font-size:14px}.pattern01 ul li{width:calc((100% - 32px) / 3)}}@media screen and (min-width:1024px) and (max-width:1279px) {.pattern01 ul li .desc h2 {font-size:14px}.pattern01 ul li{width:calc((100% - 16px) / 2)}}@media only screen and (max-width: 1023px) {.pattern01 {padding: 0 10px }.pattern01 ul li {width: 100%;}.pattern01 ul li .item img:not(article .details .divVideoStep .ivbsThumbWrapper>img, .spk-stand-wg .sp-wi-item img) {width: auto;height: 100% }.pattern01 ul li .item .imageCntnr {width: 75px;aspect-ratio: unset;height: 75px;justify-content:center}.pattern01 ul li .desc {width: calc(100% - 75px);display: inline-block;padding:6px 10px 0 }.pattern01 ul li .secName {font-size: 12px;margin-bottom:0 }.pattern01 ul li .desc h2 {font-size: 13px;-webkit-line-clamp: 2;margin-bottom: 4px;line-height: 24px;}}