@charset "UTF-8";
.special_00106 { padding: 100px 0; background-size: cover; background-repeat: no-repeat; background-position: center; }

.special_00106 .cont { margin-top: 40px; }

.special_00106 .swiper { width: calc(100vw - var(--bar-scrollbarWidth)); left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

.special_00106 .swiper .box { position: relative; overflow: hidden; background-color: #ececec; border-radius: 20px; }

.special_00106 .swiper .box::before { content: ''; display: block; padding-top: 56.17761%; }

.special_00106 .swiper .box .i { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; }

.special_00106 .swiper .box .mask { background-size: contain; background-repeat: no-repeat; background-position: bottom center; }

.special_00106 .swiper .box .txt { color: #fff; font-size: 24px; position: absolute; left: 0; right: 0; bottom: 0; text-align: center; padding: 26px 20px; }

@media (max-width: 768px) { .special_00106 .swiper .box .txt { font-size: 18px; } }

.special_00106 .swiper .swiper-button-prev, .special_00106 .swiper .swiper-button-next { position: absolute; width: 90px; height: 90px; border-radius: 50%; background: #f8f8f8; font-size: 32px; color: #00bb98; top: 0; margin: 12.8125% 0 0; font-family: xfont; background-size: cover; background-repeat: no-repeat; background-position: center; }

@media (max-width: 768px) { .special_00106 .swiper .swiper-button-prev, .special_00106 .swiper .swiper-button-next { font-size: 22px; } }

.special_00106 .swiper .swiper-button-prev::before, .special_00106 .swiper .swiper-button-next::before { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.special_00106 .swiper .swiper-button-prev { left: 15.41667%; }

.special_00106 .swiper .swiper-button-prev::before { content: '\e504'; }

.special_00106 .swiper .swiper-button-next { right: 15.41667%; }

.special_00106 .swiper .swiper-button-next::before { content: '\e505'; }

.special_00106 .swiper .pagination { color: #bfbfbf; font-family: 'Impact'; font-size: 26px; text-align: center; margin-top: 24px; display: block; }

@media (max-width: 768px) { .special_00106 .swiper .pagination { font-size: 20px; } }

.special_00106 .swiper .pagination .cur { font-size: 42px; line-height: 1.2; line-height: 1; color: #00bc99; }

@media (max-width: 768px) { .special_00106 .swiper .pagination .cur { font-size: 26px; } }

.special_00106 .swiper .pagination span { margin: 0 10px; }

.special_00106 .swiper .swiper-scrollbar { position: relative; width: 53.95833%; left: auto; bottom: auto; height: 6px; margin: 34px auto 0; background: #f8f8f8; }

.special_00106 .swiper .swiper-scrollbar .swiper-scrollbar-drag { background: #00bb98; }

.special_00106.noButton .swiper-button { display: none; }

/*	pc 端	*/
@media (min-width: 769px) { .special_00106 .swiper .swiper-button-prev:hover, .special_00106 .swiper .swiper-button-next:hover { background-color: #00bc99; color: #fff; } }

/*	1280~1440	*/
@media (max-width: 1320px) { .special_00106 .swiper .swiper-button-prev, .special_00106 .swiper .swiper-button-next { width: 50px; height: 50px; font-size: 20px; } }

@media (max-width: 1320px) and (max-width: 768px) { .special_00106 .swiper .swiper-button-prev, .special_00106 .swiper .swiper-button-next { font-size: 18px; } }

/*	1024	*/
/*	移动端	*/
@media (max-width: 768px) { .special_00106 { padding: 40px 0; }
  .special_00106 .cont { margin-top: 20px; }
  .special_00106 .swiper .pagination { margin-top: 15px; }
  .special_00106 .swiper .swiper-scrollbar { width: 100%; margin-top: 20px; }
  .special_00106 .swiper { overflow: hidden; width: 100%; -webkit-transform: none; transform: none; left: auto; }
  .special_00106 .swiper .swiper-button-prev { left: 10px; }
  .special_00106 .swiper .swiper-button-next { right: 10px; }
  .special_00106 .swiper .swiper-button-prev, .special_00106 .swiper .swiper-button-next { margin-top: 20.86957%; }
  .special_00106 .swiper .box .txt { padding: 10px; } }
