@charset "utf-8";
/* CSS Document */

.opacity_0{opacity:0;}
.opacity_x_0{opacity:0; transform: translateX(-20px);}
.opacity_y_0{opacity:0; transform: translateY(-20px);}
.opacity_y2_0{opacity:0; transform: translateY(20px);}


#home .show{
    animation-name:fadeInblur; 
    animation-duration:.5s;
    animation-delay:3.7s;
    animation-timing-function:ease-in;
    animation-fill-mode:forwards;
}
			

#home .sloganshow{
    animation-name:sloganshow; 
    animation-duration:.8s;
    animation-delay:2.8s;
    animation-timing-function:ease-out;
    animation-fill-mode:forwards;
}


@keyframes sloganshow{
	0%{
    transform:scale(0.5, 0.5);
    -webkit-transform: scale(0.5, 0.5);
		}

  85%{ opacity:0; filter:brightness(150%);	
       transform:scale(1.5, 1.5);
      -webkit-transform: scale(1.5, 1.5);
    }

	100% {opacity:1; filter:brightness(100%);
		transform:scale(1, 1);
		-webkit-transform:scale(1, 1);
		}
}

@media screen and (max-width:900px) {	

      #home .show{
        animation-delay:1.5s;
     }

      #home .sloganshow{
        animation-delay:.4s;
      }



}  

.titleshow{
    animation-name:fadeInUp; 
    animation-duration:.5s;
    animation-fill-mode:forwards;
}

/*============== section1 ==============*/

.bannershow{
    animation-name:fadeInUp; 
    animation-duration:.5s;
    animation-delay:.5s;
    animation-fill-mode:forwards;
}

.btnshow{
    animation-name:zoomin; 
    animation-duration:.25s;
    animation-delay:.9s;
    animation-fill-mode:forwards;
}

/*============== section2 ==============*/

.sec02_slogan01.sloganshow{
    animation-name:fadeIn; 
    animation-duration:.45s;
    animation-delay:.9s;
    animation-fill-mode:forwards;
}

.sec02_slogan02.sloganshow{
    animation-name:fadeIn; 
    animation-duration:.45s;
    animation-delay:1.2s;
    animation-fill-mode:forwards;
}

.sec02_txt.txtshow{
    animation-name:fadeIn; 
    animation-duration:.45s;
    animation-delay:1.1s;
    animation-fill-mode:forwards;
}

.sec02_cha01.show{
    animation-name:fadeInLt; 
    animation-duration:.5s;
    animation-delay:.5s;
    animation-fill-mode:forwards;
}

.sec02_cha02.show{
    animation-name:fadeInRt; 
    animation-duration:.5s;
    animation-delay:.5s;
    animation-fill-mode:forwards;
}

/*============== section3 ==============*/

.cha_menu_block.show{
  animation-name:fadeIn; 
  animation-duration:.5s;
  animation-delay:.5s;
  animation-fill-mode:forwards;
}

.sec03_cha01.show{
  animation-name:fadeInLt; 
  animation-duration:.5s;
  animation-delay:.9s;
  animation-fill-mode:forwards;
}

.sec03_cha02.show{
  animation-name:fadeInRt; 
  animation-duration:.5s;
  animation-delay:.9s;
  animation-fill-mode:forwards;
}

/*============== section4 ==============*/

.pic_block.show{
  animation-name:fadeIn; 
  animation-duration:.5s;
  animation-delay:.5s;
  animation-fill-mode:forwards;
}


.news_block.show {
  animation-name: fadeIn;
  animation-duration: .5s;
  animation-delay: .5s;
  animation-fill-mode: forwards;
}

.twitter_block.show {
  animation-name: fadeIn;
  animation-duration: .5s;
  animation-delay: .5s;
  animation-fill-mode: forwards;
}


#section6 .con_block.show {
  animation-name: fadeIn;
  animation-duration: .5s;
  animation-delay: .5s;
  animation-fill-mode: forwards;
}

.tv_block.show {
  animation-name: fadeIn;
  animation-duration: .5s;
  animation-delay: .5s;
  animation-fill-mode: forwards;
}

.tv_con.show {
  animation-name: fadeIn;
  animation-duration: .5s;
  animation-delay: .5s;
  animation-fill-mode: forwards;
}


/*=======fadeIn=======*/
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
@-webkit-keyframes fadeIn {
    0% {
        opacity:0; filter:blur(1.2px);
       }

    100% {
        opacity:1; filter:blur(0px);
        }
}

@keyframes fadeIn {
      0% {
        opacity:0; filter:blur(1.2px);
        }

    100% {
        opacity:1; filter:blur(0px);
        }
}

/*=======fadeInUp=======*/

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUp {
      0% {
          opacity:0; 
          -webkit-transform: translateY(20px);
          transform: translateY(20px);
      }

      100% {
          opacity:1; 
          -webkit-transform: translateY(0);
          transform: translateY(0);
      }
}

@keyframes fadeInUp {
      0% {
          opacity:0; 
          -webkit-transform: translateY(20px);
          -ms-transform: translateY(20px);
          transform: translateY(20px);
      }

      100% {
          opacity:1; 
          -webkit-transform: translateY(0);
          -ms-transform: translateY(0);
          transform: translateY(0);
      }
}


/*=======fadeInLt=======*/

.fadeInLt {
  -webkit-animation-name: fadeInLt;
  animation-name: fadeInLt;
}
@-webkit-keyframes fadeInLt {
    0% {
        opacity:0; 
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    100% {
        opacity:1; 
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes fadeInLt {
    0% {
        opacity:0; 
        -webkit-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    100% {
        opacity:1; 
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}



/*=======fadeInRt=======*/

.fadeInRt {
  -webkit-animation-name: fadeInRt;
  animation-name: fadeInRt;
}
@-webkit-keyframes fadeInRt{
    0% {
        opacity:0; 
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity:1; 
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes fadeInRt{
    0% {
        opacity:0; 
        -webkit-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity:1; 
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

/*=======zoomin=======*/

.zoomin {
  -webkit-animation-name: zoomin;
  animation-name: zoomin;
}
@-webkit-keyframes zoomin{
    0% {
        opacity:0; 
        -webkit-transform: scale(1.5, 1.5);
        transform: scale(1.5, 1.5);

    }

    100% {
        opacity:1; 
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
}

@keyframes zoomin{
    0% {
        opacity:0; 
        transform: scale(1.5, 1.5);
    }

    100% {
        opacity:1; 
        transform: scale(1, 1);
    }
}

/*======= fadeInblur =======*/
.fadeInblur {
  -webkit-animation-name: fadeInblur;
  animation-name: fadeInblur;
}

@-webkit-keyframes fadeInblur {
      0% {
        opacity: .1;	
        filter: blur(1.2px);
      }

      100% {
        opacity: 1;
        filter: blur(0px);
      }
}

@keyframes fadeInblur {
        0% {
          opacity: .1;
        filter: blur(1.2px);
        }

        100% {
          opacity: 1;
        filter: blur(0px);
        }
}


/*======= home_cha_fadeIn =======*/

.home_cha_fadeIn {
  -webkit-animation-name: home_cha_fadeIn;
  animation-name: home_cha_fadeIn;
}

@-webkit-keyframes home_cha_fadeIn {
      0% {
        opacity: .1;
        filter: blur(1.2px);
      }

      70%{filter:blur(0.8px) brightness(120%);}

      100% {
        opacity: 1;
        filter: blur(0px) brightness(100%);

      }
}

@keyframes home_cha_fadeIn {
        0% {
          opacity: .1;
          filter: blur(1.2px);
        }

        70%{filter:blur(0.8px) brightness(120%);}

        100% {
          opacity: 1;
          filter: blur(0px) brightness(100%);
        }
}

/*======= fadeIn =======*/
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeIn {
    0% {
      opacity: .1;	
    }

    100% {
      opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
      opacity: .1;
      }

    100% {
      opacity: 1;
      }
}



@media screen and (max-width:600px) {

        .opacity_0{opacity:1;}
        .opacity_x_0{opacity:1; transform: translateX(0px);}
        .opacity_y_0{opacity:1; transform: translateY(0px);}
        .opacity_y2_0{opacity:1; transform: translateY(0px);}


        #home .show{
          animation-name:none; 
        }
              
        
        #home .sloganshow{
          animation-name:none; 
        }



        .titleshow{
          animation-name:none; 
          opacity:1;
        }

        /*============== section1 ==============*/

        .bannershow{
          animation-name:none; 
        }

        .btnshow{
          animation-name:none; 
        }

        /*============== section2 ==============*/

        .sec02_slogan01.sloganshow{
          animation-name:none; 
        }

        .sec02_slogan02.sloganshow{
          animation-name:none; 
        }

        .sec02_txt.txtshow{
          animation-name:none; 
        }

        .sec02_cha01.show{
          animation-name:none; 
        }

        .sec02_cha02.show{
          animation-name:none; 
        }

        /*============== section3 ==============*/

        .cha_menu_block.show{
          animation-name:none; 
        }

        .sec03_cha01.show{
          animation-name:none; 
        }

        .sec03_cha02.show{
          animation-name:none; 
        }


        .sec04_cha.show{
          animation-name:none; 
        }

        #section4 .con_block.show {
          animation-name:none; 
        }

        /*============== section4 ==============*/

        .pic_block.show{
          animation-name:none; 
        }


        .news_block.show {
          animation-name:none; 
        }

        .twitter_block.show {
          animation-name:none; 
        }


        #section6 .con_block.show {
          animation-name:none; 
        }

        .tv_block.show {
          animation-name:none; 
        }

        .tv_con.show {
          animation-name:none; 
        }

}