* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Microsoft YaHei', serif, 'Times New Roman', Georgia, Times, Cambria;
}
a {
  text-decoration: none !important;
  cursor: pointer;
}
.container {
  width: 1200px;
  margin: auto;
}
.tl-0 {
  font-size: 40px;
}
.tl-1 {
  font-size: 36px;
}
.tl-2 {
  font-size: 32px;
}
.tl-3 {
  font-size: 28px;
}
.tl-4 {
  font-size: 24px;
}
.tl-5 {
  font-size: 20px;
}
.tl-6 {
  font-size: 18px;
}
.tl-7 {
  font-size: 16px;
}
.tl-8 {
  font-size: 14px;
}
.tl-9 {
  font-size: 12px;
}
.tl-10 {
  font-size: 10px;
}
.c-white {
  color: #fff;
}
.c-default {
  color: #333;
}
.c-main {
  color: #2582ec;
}
.c-warn {
  color: #fdd319;
}
.c-success {
  color: #5fd11d;
}
.c-error {
  color: #f14f39;
}
.c-tip {
  color: #d6d6d6;
}
.b {
  font-weight: bold;
}
.flex-list {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  list-style: none;
  padding: 0;
}
.flex-2 > .item {
  width: calc(50% - 30px * 0.5);
  margin: 15px 30px 15px 0;
}
.flex-2 > .item:nth-child(2n+2) {
  margin-right: 0;
}
.flex-3 > .item {
  width: calc(33.33333333% - 30px * 0.66666667);
  margin: 15px 30px 15px 0;
}
.flex-3 > .item:nth-child(3n+3) {
  margin-right: 0;
}
.flex-4 > .item {
  width: calc(25% - 30px * 0.75);
  margin: 15px 30px 15px 0;
}
.flex-4 > .item:nth-child(4n+4) {
  margin-right: 0;
}
.flex-5 > .item {
  width: calc(20% - 30px * 0.8);
  margin: 15px 30px 15px 0;
}
.flex-5 > .item:nth-child(5n+5) {
  margin-right: 0;
}
.flex-6 > .item {
  width: calc(16.66666667% - 30px * 0.83333333);
  margin: 15px 30px 15px 0;
}
.flex-6 > .item:nth-child(6n+6) {
  margin-right: 0;
}
.flex-7 > .item {
  width: calc(14.28571429% - 30px * 0.85714286);
  margin: 15px 30px 15px 0;
}
.flex-7 > .item:nth-child(7n+7) {
  margin-right: 0;
}
.flex-8 > .item {
  width: calc(12.5% - 30px * 0.875);
  margin: 15px 30px 15px 0;
}
.flex-8 > .item:nth-child(8n+8) {
  margin-right: 0;
}
.flex-9 > .item {
  width: calc(11.11111111% - 30px * 0.88888889);
  margin: 15px 30px 15px 0;
}
.flex-9 > .item:nth-child(9n+9) {
  margin-right: 0;
}
.flex-10 > .item {
  width: calc(10% - 30px * 0.9);
  margin: 15px 30px 15px 0;
}
.flex-10 > .item:nth-child(10n+10) {
  margin-right: 0;
}
.flex {
  display: flex;
  align-items: center;
}
.flex.center {
  justify-content: center;
}
.flex.left {
  justify-content: left;
}
.flex.right {
  justify-content: right;
}
.swiper-pagination-bullet-active {
  width: 20px;
  border-radius: 5px;
}
.content-wrap {
  position: relative;
}
.swiper-control > div {
  height: 32px;
  width: 32px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  top: calc(50% - 32px);
}
.swiper-control > div:hover {
  cursor: pointer;
}
.swiper-control > div img {
  width: 100%;
}
.left-btn {
  position: absolute;
  left: -34px;
}
.right-btn {
  position: absolute;
  right: -34px;
}
.slide-group {
  padding: 0 14px;
}
.slide-group .item {
  position: relative;
  height: 180px;
}
.slide-group .item img {
  width: 100%;
  transform: scale(1);
  transition: 0.2s ease-in-out;
}
.slide-group .item .name {
  padding: 20px 0;
  text-align: center;
}
.slide-group .item.shadow {
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);
}
.slide-group .item ::-webkit-scrollbar {
  width: 5px;
  background-color: #083f8b;
}
.slide-group .item .extra {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  padding: 20px;
  opacity: 0;
  background: rgba(23, 107, 226, 0.8);
  z-index: 3;
  flex-direction: column;
  transition: 0.2s ease-in-out;
  overflow-y: auto;
}
.slide-group .item .extra > * {
  margin-bottom: 2px;
}
.slide-group .item .extra .link {
  display: block;
  color: #fff;
  font-weight: bold;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: inline-block;
  width: 100%;
}
.slide-group .item .extra .link:hover {
  text-decoration: underline !important;
}
.slide-group .item:hover .extra {
  opacity: 1;
}
.slide-group.type2 .item {
  overflow: hidden;
}
.slide-group.type2 .item img {
  height: 100%;
}
.slide-group.type2 .item .name {
  position: absolute;
  top: 20px;
  left: 20px;
  text-align: left;
  padding: 0;
  user-select: none;
}
.slide-group.type2 .item .name a {
  display: block;
}
.slide-group.type2 .item:nth-child(1) .name {
  color: #3D625D;
}
.slide-group.type2 .item:nth-child(2) .name {
  color: #594A9B;
}
.slide-group.type2 .item:nth-child(3) .name {
  color: #3D5C99;
}
.slide-group.type2 .item:nth-child(4) .name {
  color: #6B502A;
}
.slide-group.type2 .item:hover img {
  transform: scale(1.2);
}
.tab-wrap {
    border-bottom: 2px solid #888;
}
.tab-wrap .tl-4 {
    color: #444;
}
.tab-wrap .tl-4 span {
    display: inline-block;
    margin-right: 10px;
    padding-bottom: 8px;
    position: relative;
    cursor: pointer;
}
.tab-wrap .tl-4 span.active {
    color: #347fe7;
}
.tab-wrap .tl-4 span.active::after {
    content: '';
    display: inline-block;
    height: 4px;
    width: 100%;
    position: absolute;
    z-index: 9;
    background: #4293F4;
    bottom: -3px;
    left: 0%;
    transition: 0.2s ease-in-out;
}
.tab-wrap .tl-4 span:hover {
    color: #578bd3;
}
.tab-content {
    display: none;
    margin-top: 10px;
}
.tab-content.active {
    display: flex;
}
.tab-content .item {
    text-align: center;
    background: #f6f6f6;
    padding: 16px 0;
    transition: 0.2s ease-in-out;
    box-shadow: 0 0px 6px 0 rgba(0, 0, 0, 0.3);
}
.tab-content .item:hover {
    box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.25);
    filter: brightness(1.02);
}
.tab-content .item .img-wrap {
    display: inline-block;
    width: 60px;
    overflow: hidden;
}
.tab-content .item .text {
    font-weight: bold;
}