.MES-wrapper .card .name { width: 280px; line-height: 1; }
.MES-wrapper .card .name span { letter-spacing: 4px; }
.MES-wrapper .card .name h5 { margin-top: 20px; font-size: 40px; color: #1f3ea7; }
@media (max-width: 414px) { 
  .MES-wrapper .card .name { width: 100%; margin-bottom: 30px; }
  .MES-wrapper .card .name h5 { font-size: 20px; margin-top: 15px; }
}

.MES-wrapper { padding-top: 50px; }
.MES-wrapper .MES { margin-top: 30px;  }
.MES-wrapper .MES .tab-name { position: relative; }

.MES-wrapper .MES .tab { line-height: 60px; color: #5a5a5a; font-size: 18px; text-align: center; background-color: #f1f1f1; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;border-left: 1px solid #dfdfdf; cursor: pointer; margin-right: -1px; }
.MES-wrapper .MES .tab:last-child { border-right: 1px solid #dfdfdf; }

.MES-wrapper .MES .tab.active {background-color: -webkit-gradient(linear, left bottom, right top, from(#b30e77), to(#6f055f)); background-image: -o-linear-gradient( left bottom, #b30e77, #6f055f); background-image: linear-gradient(to right top, #b30e77, #6f055f); color: #fff;}

.MES-wrapper .MES .content { padding-top: 80px; text-align: center; margin: 0 auto; background-color: #f8f8f8; }
.MES-wrapper .MES .content .card { border: none; background: none!important;}
.MES-wrapper .MES .content .card span { line-height: 36px; letter-spacing: 4px; font-size: 20px;  margin-top: 28px;}
.MES-wrapper .MES .content .card h3 { font-size: 36px; line-height: 36px; color: #0f6ad4; margin-top:18px; margin-bottom: 30px; font-weight: bold; }
.MES-wrapper .MES .content .card p { font-size: 16px; line-height: 26px; }

.swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; z-index: 1; }

.swiper-container-no-flexbox .swiper-slide { float: left; }

.swiper-container-vertical > .swiper-wrapper { -webkit-box-orient: vertical; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }

.swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-transition-property: -webkit-transform; -o-transition-property: -o-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform, -o-transform; transition-property: transform,-webkit-transform,-o-transform; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }

.swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0, 0, 0); -o-transform: translate(0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.swiper-container-multirow > .swiper-wrapper { -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }

.swiper-container-free-mode > .swiper-wrapper { -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; }

.swiper-slide { -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; }

.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height: auto; }

.swiper-container-autoheight .swiper-wrapper { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; -webkit-transition-property: -webkit-transform,height; -o-transition-property: -o-transform; -webkit-transition-property: height,-webkit-transform; transition-property: height,-webkit-transform; -o-transition-property: height,-o-transform; transition-property: transform,height; transition-property: transform,height,-webkit-transform,-o-transform; }

.swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; }

.swiper-wp8-horizontal { -ms-touch-action: pan-y; touch-action: pan-y; }

.swiper-wp8-vertical { -ms-touch-action: pan-x; touch-action: pan-x; }

.swiper-button-next, .swiper-button-prev { position: absolute; top: 50%; width: 27px; height: 44px; margin-top: -22px; z-index: 10; cursor: pointer; background-size: 27px 44px; background-position: center; background-repeat: no-repeat; }

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity: .35; cursor: auto; pointer-events: none; }

.swiper-pagination { position: absolute; text-align: center; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; }

.swiper-pagination.swiper-pagination-hidden { opacity: 0; }

.swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; }

.swiper-container-fade.swiper-container-free-mode .swiper-slide { -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; }

.swiper-container-fade .swiper-slide { pointer-events: none; -webkit-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity; }

.swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none; }

.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto; }

.swiper-pagination.swiper-pagination-hidden { opacity: 0; }

.swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; -webkit-border-radius: 100%; border-radius: 100%; background: #b4b4b4; }

button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; -webkit-box-shadow: none; box-shadow: none; -moz-appearance: none; -ms-appearance: none; -webkit-appearance: none; appearance: none; }

.swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; }

.swiper-pagination-bullet-active { opacity: 1; background: #1e3b9e; }

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 0%; left: 0; width: 100%; }

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 5px; }

.swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: 10px; left: auto; }

.swiper-button-prev, .swiper-button-next { width: 20px; height: 20px; border-right: 2px solid #cecece; border-bottom: 2px solid #cecece; }

.swiper-button-prev { -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); left: -30px; }

.swiper-button-next { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); right: -30px; }

.swiper-button-prev:hover, .swiper-button-next:hover { border-right: 1px solid #1f3ea7; border-bottom: 1px solid #1f3ea7; }

.swiper-button-next, .swiper-button-prev { position: absolute; top: 50%; width: 27px; height: 44px; margin-top: -22px; z-index: 10; cursor: pointer; background-size: 27px 44px; background-position: center; background-repeat: no-repeat; }

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity: .35; cursor: auto; pointer-events: none; }

.swiper-button-prev, .swiper-button-next { width: 20px; height: 20px; border-right: 1px solid #cecece; border-bottom: 1px solid #cecece; }

.swiper-button-prev { -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); left: -30px; }

.swiper-button-next { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); right: -30px; }

.swiper-button-prev:hover, .swiper-button-next:hover { border-right: 1px solid #6f055f; border-bottom: 1px solid #6f055f; }
.swiper-button-mon-prev, .swiper-button-mon-next { width: 20px; height: 62px; border-right: none; border-bottom: none; top: 35%; background-color: #e3e3e3; transform: rotate(0); }

.swiper-button-mon-prev:hover, .swiper-button-mon-next:hover { background-color: #b30e77; }

.swiper-button-mon-prev:hover::before, .swiper-button-mon-next:hover::after { border-right: 1px solid #fff; border-bottom: 1px solid #fff; }

.swiper-button-mon-prev::before { content: ''; width: 5px; height: 5px; border-right: 1px solid #333; border-bottom: 1px solid #333; -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); position: absolute; top: 50%; left: 50%; }

.swiper-button-mon-next::after { content: ''; width: 5px; height: 5px; border-right: 1px solid #333; border-bottom: 1px solid #333; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); position: absolute; top: 50%; left: 40%;}
.orangecircle{width:30px; height:30px; border-radius: 30px; background-color: #e94709; color: #fff; font-size: 18px; text-align: center; line-height: 30px; position: absolute; font-style: normal;}
.pright{right:-30px;}
.pleft{left:-25px;}
h5:hover{ color: #e94709; cursor: pointer;}
.td-wrapper p{padding-left: 16px;}
.v-container,.v-container .container{height: 100%!important;}
.v-title{top:50px;}
.v-item{border-left:1px rgba(255,255,255,.5) solid; padding-top: 220px!important;}
.v-item:hover{background-color: -webkit-gradient(linear, bottom, top, from(rgba(179,14,119,.5)), to(rgba(179,14,119,0))); background-image: -o-linear-gradient( bottom, rgba(179,14,119,.5), rgba(179,14,119,0)); background-image: linear-gradient(to top, rgba(179,14,119,.5), rgba(179,14,119,0));padding-top: 200px!important;}
.v-item:last-child{border-right:1px rgba(255,255,255,.5) solid;}
.ico{ display: block; margin: auto!important;}
.ico img{ display: block; margin: auto!important;}
.v-section{background-color:#333 ; height: 657px; background-image: url(/assets/images/product/mes/JZ_BG.jpg); background-position: center;}

@media (max-width: 1024px) {
  .MES-wrapper .MES{ width: 93%; margin: 0 auto;}
}

@media (max-width: 768px) {
  .MES-wrapper { padding-top: 60px;}
  .MES-wrapper .MES .content{padding-left: 20px; padding-right: 20px; width: 100%;}
  .MES-wrapper .MES .content .card h3 {font-size: 20px; line-height: 20px;}
  .v-section{background-color:#333 ; height: 920px; background-image: url(/assets/images/product/mes/JZ_BG.jpg); background-position: center; background-size: cover;}
  .v-item{border-left:1px rgba(255,255,255,.5) solid; padding-top: 130px!important;}
  .v-item:hover{padding-top: 130px!important;}
  .v-item:nth-child(2){border-right:1px rgba(255,255,255,.5) solid;}
  .v-item:nth-child(3){margin-top: 3px!important;}  
  .v-item:last-child{margin-top: 3px!important;}

}

@media (max-width: 576px) {
    .v-section{background-color:#333 ; height: 990px; background-image: url(/assets/images/product/mes/JZ_BG.jpg); background-position: center; background-size: cover;}
  .MES-wrapper .MES { width: 85%; margin: 0 auto;}
  .swiper-button-mon-prev, .swiper-button-mon-next{height: 50px;}
  .MES-wrapper .MES .content { width: 100%; padding-top: 25px; }
  .MES-wrapper .MES .content .card span { letter-spacing: 2px; }
  .MES-wrapper .MES .content .card h3 { margin-top: 10px; margin-bottom: 20px;}
  .MES-wrapper .MES .content .card p { padding: 0 15px; } 
}
