@charset "utf-8";

  .animated {
    -moz-animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    
    -moz-animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  }

  .animated2 {
    -moz-animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    
    -moz-animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  }

  .animated.flipOutX,
  .animated.flipOutY,
  .animated.bounceIn,
  .animated.bounceOut {
    -moz-animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
  }

  #wrap #content .section#home .line_box .box .line{
    -moz-animation-duration: 1s;
      -webkit-animation-duration: 1s;
      animation-duration: 1s;
      
      -moz-animation-fill-mode: both;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
  }




  #wrap #content ul.bxslider li .bg img {
    -webkit-animation: scale_vis 6s infinite alternate ease-in-out;
    animation: scale_vis 6s infinite alternate ease-in-out;
  }

  /*추가*/
  
  #wrap ul.bxslider li .bg img {
    -webkit-animation: scale_vis 6s infinite alternate ease-in-out;
    animation: scale_vis 6s infinite alternate ease-in-out;
  }
  


  @keyframes scale_vis {
    from {
      transform-origin: center;
      -ms-transform: scale(1.0, 1.0); /* IE 9 */
      -o-transform: scale(1.0, 1.0); /* IE 9 */
      -moz-transform: scale(1.0, 1.0); /* IE 9 */
      -webkit-transform: scale(1.0, 1.0); /* Chrome, Safari, Opera */
      transform: scale(1.0, 1.0);
    }

    to {
      transform-origin: center;
      -ms-transform: scale(1, 1); /* IE 9 */
      -o-transform: scale(1, 1); /* IE 9 */
      -moz-transform: scale(1, 1); /* IE 9 */
      -webkit-transform: scale(1, 1); /* Chrome, Safari, Opera */
      transform: scale(1, 1);
    }
  }

  .scale_vis {
    -moz-animation-name: scale_vis;
    -webkit-animation-name: scale_vis;
    animation-name: scale_vis;
  }





  @keyframes rotateIn {
    from {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, 90deg);
      opacity: 0;
    }

    to {
      transform-origin: center;
      transform: none;
      opacity: 1;
    }
  }

  .rotateIn {
    -moz-animation-name: rotateIn;
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn;
  }

    @keyframes rotateReverse {
    from {
      transform-origin: center;
      transform: rotate3d(0, 0, 1, -90deg);
      opacity: 0;
    }

    to {
      transform-origin: center;
      transform: none;
      opacity: 1;
    }
  }

  .rotateReverse {
    -moz-animation-name: rotateReverse;
    -webkit-animation-name: rotateReverse;
    animation-name: rotateReverse;
  }

  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
    }

    to {
      opacity: 1;
      transform: none;
    }
  }

  .fadeInUp {
    -moz-animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
  }

  @keyframes fadeInDown {
    from {
      opacity: 1;
      transform: none;
    }

    to {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
      visibility: hidden;
    }
  }

  .fadeInDown {
    -moz-animation-name: fadeInDown;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
  }



  @keyframes fadeInUps {
    from {
      opacity: 0;
      transform: none;
      transform: translate3d(0, 100%, 0);
    }
    
    20% {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
    }

    to {
      opacity: 1;
      transform: none;
    }
  }

  .fadeInUps {
    -moz-animation-name: fadeInUps;
    -webkit-animation-name: fadeInUps;
    animation-name: fadeInUps;
  }

  @keyframes fadeInDowns {
    from {
      opacity: 1;
      transform: none;
    }
    
    50% {
      opacity: 0;
      transform: translate3d(0, 100%, 0);
    }

    to {
      opacity: 0;
      transform: none;
      transform: translate3d(0, 100%, 0);
      visibility: hidden;

    }
  }

  .fadeInDowns {
    -moz-animation-name: fadeInDowns;
    -webkit-animation-name: fadeInDowns;
    animation-name: fadeInDowns;
  }

  @keyframes fadeOut {
    from {
      opacity: 0.4;
    }

    to {
      opacity: 1;
    }
  }

  .fadeOut {
    -moz-animation-name: fadeOut;
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
  }