@keyframes trans_f {
  50% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px)
  }
}

@keyframes trans_v {
  50% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
}

@keyframes scale_L {
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}

@keyframes scale_S {
  50% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@keyframes scale_infinite {
  25% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  75% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

/* mouseover animate */
.zoomAni {overflow:hidden;position:relative;}
.zoomAni img {overflow:hidden;position:relative;
              -webkit-transform:scale(1);
              -moz-transform:scale(1);
              -ms-transform:scale(1); 
              -o-transform:scale(1);  
              transform:scale(1);
              -webkit-transition:.4s ease-in-out !important;
              -moz-transition:.4s ease-in-out !important;
              -ms-transition:.4s ease-in-out !important;
              -o-transition:.4s ease-in-out !important;
              transition:.4s ease-in-out !important;
	
}
.zoomAni:hover img {
	                -webkit-transform:scale(1.1);
	                -moz-transform:scale(1.1);
	                -ms-transform:scale(1.1);
	                -o-transform:scale(1.1);
	                transform:scale(1.1);
	
}



.S20_ontypeA:hover .sectionTit span{
  -webkit-animation-name: trans_f;
  animation-name: trans_f;
  -webkit-animation-duration: 0.2s;
  animation-duration: 0.2s;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}


.S20_ontypeB:hover .sectionTit span{
  -webkit-animation-name: trans_v;
  animation-name: trans_v;
  -webkit-animation-duration: 0.2s;
  animation-duration: 0.2s;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

.S20_Oeditorial:hover .quotation img{
   -webkit-animation-name: scale_L;
  animation-name: scale_L;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
   -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
}

.S20_Plan  li:hover .tit_f h4{
  transition: all 0.3s ease-in-out;
  -webkit-transform: translateY(-35px);
  transform: translateY(-35px);

}

.S20_Plan_past li:hover{transition: all 0.3s cubic-bezier(0.930, 0.635, 0.650, 0.970);box-shadow: inset 0 0 15px #212021;}

.S20_Picture  li:hover .play{
   -webkit-animation-name: scale_infinite;
  animation-name: scale_infinite;
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
