.img_effect_colty{
    width: 720px;
    height: 360px;
    position: relative;
    overflow: hidden;
    border: 1px solid #aaa;
  }

  .img1{
    width: 720px;
    height: 360px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img1_a 24s infinite;
  }

  .img2{
    width: 720px;
    height: 720px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img2_a 24s infinite ease-out;
  }

  .img3{
    width: 720px;
    height: 720px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img3_a 24s infinite ease-out;
  }

  .img4{
    width: 1080px;
    height: 720px;
    position: absolute;
    top:0px;
    left:-360px;
    animation: img4_a 24s infinite ease-out;
  }

  .img5{
    width: 720px;
    height: 360px;
    position: absolute;
    top:0px;
    left:0px;
    animation: img5_a 24s infinite;
  }

  @keyframes img1_a{
    0%{opacity: 0;}
    5%{opacity: 1;}
    15%{opacity: 1;}
    20%{opacity: 0;}
    100%{opacity: 0;}
  }

  @keyframes img2_a{
    0%{opacity: 0;}
    20%{opacity: 0;transform: translateY(0px);}
    25%{opacity: 1;}
    38%{opacity: 1;}
    40%{opacity: 0;transform: translateY(-360px);}
    100%{opacity: 0;}
  }

  @keyframes img3_a{
    0%{opacity: 0;}
    40%{opacity: 0;transform: translateY(-360px);}
    45%{opacity: 1;}
    58%{opacity: 1;}
    60%{opacity: 0;transform: translateY(0px);}
    100%{opacity: 0;}
  }

  @keyframes img4_a{
    0%{opacity: 0;}
    60%{opacity: 0;transform: translateX(360px);}
    65%{opacity: 1;}
    78%{opacity: 1;}
    80%{opacity: 0;transform: translateX(0px);}
    100%{opacity: 0;}
  }

  @keyframes img5_a{
    0%{opacity: 0;}
    80%{opacity: 0;}
    85%{opacity: 1;}
    95%{opacity: 1;}
    100%{opacity: 0;}
  }

  .h3_mitte_test01{
    width: 760px;box-sizing: border-box;padding: 15px 0px;font-size: 34px;line-height: 110%;color: #fff;background-color: #ff007a;
  }
  
  .h3_mitte_test01 span, .h3_mitte_test02 span{
    font-size: 23px;display: block;
  }
  
  .h3_mitte_test02{
    width: 760px;box-sizing: border-box;padding: 15px 0px;font-size: 34px;line-height: 110%;color: #fff;background-color: #ff007a;
    border-radius: 5px 5px;box-shadow: 2px 2px 4px #888;margin-bottom: 40px;position: relative;border: 2px solid #eee;
  }
  
  .h3_mitte_test02 a{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  
  .h3_mitte_test02:hover{
    opacity: 0.8;
  }