body {
    margin: 0;
  }
  h2{	
    font-family: -webkit-pictograph;
    font-size:30px;
    font-style:italic;
    text-align:center;
  }
  .swiper-container {
      /* margin: 0 13%; */
      padding-bottom:10px;
  }
  .swiper-slide {
      width:200px;
      height: 230px;
      transition-timing-function:linear;
  }
  /* @media only screen and (max-width:1200px){
      .swiper-slide {
          width:770px;
      }
  } */
  @media only screen and (max-width:980px){
      .swiper-slide {
          width:300px;
      }
  }
  @media only screen and (max-height:480px){
      .swiper-slide {
          width:471px;
      }
  }
  .swiper-wrapper img:hover{
    transform: scale(1.7);
  }
  .swiper-slide img{
      /* width:300px;
      height: 200px; */      
    width: auto;  
    height: auto;  
    margin: 0 auto;
    max-width: 100%;  
    max-height: 100%;   
    border-radius: 4px;
  }
  .swiper-wrapper{
    width:150px;
    height: 230px;
    text-align: center;
    transition-timing-function:linear;
  }
  .imgs-1 , .imgs-2 {
    width:310px;
    height: 250px;
    text-align: center;
    transition-timing-function:linear;
  }
  .imgs-1 img:hover , .imgs-2 img:hover{
    transform: scale(1.3);
  }
  .swiper-slide .title{
      position:absolute;
      transform:rotate(90deg);
      transform-origin:left top;
      left:-3px;
      font-size:11px;
      color: rgb(102, 102, 102);}	
  /* .swiper-button-next, .swiper-button-prev{
      width:86px;
      height:112px;
      background-size:86px 112px;
      margin-top:-56px;
      outline:none;}
  .swiper-button-next{
      background-image:url(img/cursor-next.png);}
  .swiper-button-prev{
      background-image:url(img/cursor-prev.png);}		 */
  .swiper-pagination-bullet{
      background:none;
      opacity:1;
      margin:0 6px !important;
      width:9px;
      height:9px;
      position:relative;
      outline:none;
      vertical-align:middle;}
  .swiper-pagination-bullet span{
      width:3px;
      height:3px;
      background:#CCC;
      display:block;
      border-radius:50%;
      margin-top:3px;
      margin-left:3px;
  }
  .swiper-pagination-bullet i{
      background:#000;
      height:1px;
      width:20px;
      position:absolute;
      top:4px;
      transform:scaleX(0);
      transform-origin:left;
      z-index:3;
      transition-timing-function:linear;
      }
  .swiper-pagination-bullet-active span,.swiper-pagination-bullet:hover span{
      width:9px;
      height:9px;
      margin-top:0;
      margin-left:0;
      background:#000;
      position:relative;
      z-index:1;
      }
  .swiper-pagination-bullet-active i{
      animation:middle 6s;
      }
  .swiper-pagination-bullet:first-child.swiper-pagination-bullet-active i{
      animation:first 6s;
      }
  .swiper-pagination-bullet:last-child.swiper-pagination-bullet-active i{
      animation:last 6s;
      }				
  @keyframes first{
    0% {transform:scaleX(0.5);left:0px;}/*091*/
    100% {transform:scaleX(1);left:2px;} /*0915*/
  }
  @keyframes last{
    0% {transform:scaleX(0.7);left:-10px;}/*1090*/
    20% {transform:scaleX(0.3);left:2px;} /*090*/
    100% {transform:scaleX(0.3);left:0px;} /*090*/
  }		
  @keyframes middle{
    0% {transform:scaleX(0.7);left:-10px;}/*1091*/
    20% {transform:scaleX(0.45);left:2px;}/*092*/
    100% {transform:scaleX(1);left:2px;} /*0913*/
  }	
  /* .swiper-wrapper >img {
      width: 250px;
      height: 300px;
  } */